Actualmente tengo esta tabla, donde cuando el usuario hace clic en el botón cambia el estado "editForm", pero también quiero cambiar el estado de idColab cuando el usuario hace clic en el botón, ¿cómo puedo lograrlo?
obs: El ID se pasa como parámetro.
const [editForm, setEditForm] = useState(false) const [idColab, setIdColab] = useState("") const exibirForm = () => { setEditForm(!editForm) } const setIdColab = (id) => { idColab = id }El ID proviene de este mapeo:
const renderTable = () => { return data.map((colaborador, idx) => { const {id, nome, matricula, funcao, tipo_acesso, cpf} = colaborador return ( <tr> <td className='data-cell'>{nome}</td> <td className='data-cell'>{matricula}</td> <td className='data-cell'>{newFuncao}</td> <td className='data-cell'>{newAcesso}</td> <td className='data-cell'>{cpf}</td> <td className='data-cell'>{id}</td> <td className='btn-cell'><input className="edit-btn" type="submit" value="Editar" onClick={exibirForm(id)} /></td> </tr> ) }) }Agregando el código dentro de la función llamada:
const exibirForm = () => { setEditForm(!editForm) setInput({ idColab: "1234" }); }Al crear una función que llame a más funciones
const masterFunction = () => { function1(); function2(); // ... more functions ... }O aún más compacto:
<input onClick={() => { function1(); function2(); }} />Cree una función principal que llame a ambas funciones y pase la función principal a su detector de eventos.