Untitled
unknown
typescript
3 years ago
1.0 kB
8
Indexable
import React, { useState } from 'react';
interface FormState {
name: string;
email: string;
}
const Form: React.FC = () => {
const [formData, setFormData] = useState<FormState>({ name: '', email: '' });
const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
setFormData({ ...formData, [e.target.name]: e.target.value });
};
const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
e.preventDefault();
console.log(formData);
};
return (
<form onSubmit={handleSubmit}>
<label>
Name:
<input
type="text"
name="name"
value={formData.name}
onChange={handleChange}
/>
</label>
<br />
<label>
Email:
<input
type="email"
name="email"
value={formData.email}
onChange={handleChange}
/>
</label>
<br />
<button type="submit">Submit</button>
</form>
);
};
export default Form;
Editor is loading...