How do you handle a form with many fields cleanly?
Quick answer
Keep one state object and a single change handler that updates by the input's name attribute, immutably.
In detail
Instead of one useState per field, store an object and use a computed key from e.target.name to update the right field with spread. For larger or performance-sensitive forms, use a library like React Hook Form which uses uncontrolled inputs to minimise re-renders.
1const [form, setForm] = useState({ email: '', password: '' });
2const onChange = e => {
3 const { name, value } = e.target;
4 setForm(p => ({ ...p, [name]: value }));
5};
6<input name="email" value={form.email} onChange={onChange} />Why interviewers ask this: Practical forms skill used in nearly every app.
This is 1 of 118+ questions in the React Interview Kit
Get every question with detailed answers, follow-ups and real code — plus coding challenges and a last-minute revision sheet. One-time payment, instant access.
⚡ Get the React Interview Kit → ₹399