Tengo un formulario redux dentro de un componente "MyEditDataForm" y estoy pasando una función para manejar el envío de esta manera:
const myHandleSubmit = ({ firstInputFieldName, secondInputFieldName }) => { console.log(firstInputFieldName); console.log(secondInputFieldName); }; const EditDataPage = () => { return ( <Container> <Row> <MyEditDataForm onSubmit={myHandleSubmit} /> </Row> </Container> ); };Salida de consola: "john", "doe"
Hasta ahora todo bien... Ahora me gustaría agregar un parámetro a myHandleSubmit, que quiero pasar a myHandleSubmit. Como esto:
const myHandleSubmit = ({ firstInputFieldName, secondInputFieldName, anotherParameter }) => { console.log(firstInputFieldName); console.log(secondInputFieldName); console.log(anotherParameter); }; const EditDataPage = () => { const aNewParameter = "some info"; return ( <Container> <Row> <MyEditDataForm onSubmit={myHandleSubmit({ anotherParameter: aNewParameter })} /> </Row> </Container> ); };Salida antes de hacer clic en el botón Enviar: indefinido, indefinido, "alguna información"
Después de hacer clic en el botón: "Error: debe pasar handleSubmit() una función onSubmit o pasar onSubmit como accesorio"
¿Cómo es posible pasar un NewParameter a myHandleSubmit, sin destruir la funcionalidad de envío de formulario? He intentado hacer esto con bind():
<MyEditDataForm onSubmit={myHandleSubmit.bind({ anotherParameter: aNewParameter })} />Salida: "john", "doe", indefinido
¿Qué estoy haciendo mal?
Probablemente necesites esto:
const myHandleSubmit = ({ firstInputFieldName, secondInputFieldName, anotherParameter }) => { console.log(firstInputFieldName); console.log(secondInputFieldName); console.log(anotherParameter); }; const EditDataPage = () => { const aNewParameter = "some info"; return ( <Container> <Row> <MyEditDataForm onSubmit={(fields) => myHandleSubmit({ ...fields, anotherParameter: aNewParameter })} /> </Row> </Container> ); };