If you would like to handle multiple inputs with one handler take a look at my approach where I'm using computed property to get value of the input based on it's name.
import React, { useState } from "react";
import "./style.css";
export default function App() {
const [state, setState] = useState({
name: "John Doe",
email: "[email protected]"
});
const handleChange = e => {
setState({
[e.target.name]: e.target.value
});
};
return (
<div>
<input
type="text"
className="name"
name="name"
value={state.name}
onChange={handleChange}
/>
<input
type="text"
className="email"
name="email"
value={state.email}
onChange={handleChange}
/>
</div>
);
}