Lo que quiero hacer es simple, solo tome valores de campo de entrada y haga algo con ellos haciendo clic en el botón.

 function TableFooterPanel() { const [firstName, setFirstName] = useState(''); const [lastName, setLastName] = useState(''); const sampleMethod = (x, y) => { console.log(x + y) } return ( <> <Card className='buttonFooter'> <Form className='buttonFooter'> <input type="text" placeholder="First Name" defaultValue={firstName} onClick={setFirstName}></input> <input type="text" placeholder="Last Name" defaultValue={lastName} onClick={setLastName}></input> <Button onClick={() => sampleMethod(firstName, lastName)}>Add</Button> </Form> </Card> </> ); } export default TableFooterPanel;

En general, los ejemplos para eso se hacen con métodos handleChange() separados para cada campo de entrada, pero no quiero hacer funciones separadas para cada uno, así que pensé en usar useState. ¿Cómo puedo llamar a sampleMethod con estos parámetros? No pude actualizar los valores correctamente con useState.