43 lines
1.1 KiB
JavaScript
43 lines
1.1 KiB
JavaScript
import React, { useState } from 'react';
|
|
|
|
function Login(props) {
|
|
const [username, setUsername] = useState("");
|
|
const [password, setPassword] = useState("");
|
|
|
|
const handleUsernameChange = (event) => {
|
|
setUsername(event.target.value);
|
|
}
|
|
|
|
const handlePasswordChange = (event) => {
|
|
setPassword(event.target.value);
|
|
}
|
|
|
|
const handleLogin = (event) => {
|
|
props.onChange({ username: this.state.username, password: this.state.password });
|
|
event.preventDefault();
|
|
}
|
|
|
|
return (
|
|
<div className="Login-Component">
|
|
<form onSubmit={handleLogin}>
|
|
<fieldset>
|
|
<legend>Login</legend>
|
|
|
|
<label for="username">Username:</label>
|
|
<input id="username" name="username" type="text"
|
|
value={username}
|
|
onChange={handleUsernameChange} />
|
|
<label for="password">Password:</label>
|
|
<input id="password" name="password" type="password"
|
|
value={password}
|
|
onChange={handlePasswordChange} />
|
|
|
|
<input type="submit" value="Submit" />
|
|
</fieldset>
|
|
</form>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default Login
|