import React, { useState } from "react";
function Form() {
const [user, setUser] = useState({
name: "",
email: "",
password: "",
});
const { name, email, password } = user;
const handleChange = (e) => {
const { name, value } = e.target;
setUser({
...user,
[name]: value,
});
};
const handleSubmit = (e) => {
e.preventDefault();
console.log("Form Submitted");
console.log(user);
};
return (
<div>
<h1>Registraction</h1>
<form action="" onSubmit={handleSubmit}>
<div className="formGroup">
<label htmlFor="name">Name: </label>
<input
type="text"
name="name"
id="name"
value={name}
onChange={handleChange}
required
/>
</div>
<div className="formGroup">
<label htmlFor="email">Email: </label>
<input
type="email"
name="email"
id="email"
value={email}
onChange={handleChange}
required
/>
</div>
<div className="formGroup">
<label htmlFor="password">Password: </label>
<input
type="password"
name="password"
id="password"
value={password}
onChange={handleChange}
required
/>
</div>
<div className="formGroup">
<button className="count_btn" type="Submit">
Register
</button>
</div>
</form>
</div>
);
}
export default Form;