Parece que no entiendo completamente cómo funciona el "cierre". Tengo una entrada al cambiar la cual necesito llamar a funciones y pasarle 2 argumentos. Pero también necesito el evento de este evento.
Mi versión a continuación no funciona. Solo funcionará la primera parte de la función, y la segunda (donde devuelvo la segunda función) no funciona. Lamentablemente, no puedo entender cuál es mi error y cómo hacer el "cierre" hasta el final.
Y la segunda, mini pregunta: ¿cómo escribir exactamente evento aquí si estoy trabajando en reaccionar?
const handleChangeClosure = (userId: string, role: string) => (event: ???) => { const { checked } = event.target; dispatch(addOrDeleteRoleAction(userId, role, checked, dispatch)); }; <input type="checkbox" onChange={() => handleChangeClosure(user.userId, "Controller")}/>Reemplazar
<input type="checkbox" onChange={() => handleChangeClosure(user.userId, "Controller")}/>Con
<input type="checkbox" onChange={handleChangeClosure(user.userId, "Controller")}/> La función handleChangeClosure devuelve una función y el evento onChange espera una función. Entonces no necesita ()=> que simplemente lo envolvería en otra función.
Alternativamente, esto también funcionaría:
<input type="checkbox" onChange={(ev) => handleChangeClosure(user.userId, "Controller")(ev)}/>Pero eso es solo más código inútil.
Al usar onChange={() => ...} , está perdiendo el argumento del event .
lo que quieres es
<input type="checkbox" onChange={handleChangeClosure(user.userId, "Controller")}/>Su función de orden superior devuelve una nueva función de controlador de eventos que se adjuntará al evento de cambio .
FYI, el tipo de event es React.ChangeEvent<HTMLInputElement>
const handleChangeClosure = (userId: string, role: string) => (event: React.ChangeEvent<HTMLInputElement>) => { const { checked } = event.target; dispatch(addOrDeleteRoleAction(userId, role, checked, dispatch)); };