withFormik，将函数作为道具传递
withFormik，将函数作为道具传递
提问于 2019-06-24 03:41:24
我正在使用Formik构建一个用户输入表单。我正在使用withFormik处理我的表单。我目前在我的组件中传递我的handleSubmit，如下所示：
export const CreateForm = withFormik({
mapPropsToValues: () => ({
primarySkill: "12"
}),
validationSchema: () => FormSchema,
handleSubmit: (values, { setSubmitting }) => {
setTimeout(() => {
alert(JSON.stringify(values, null, 2)); // For testing
setSubmitting(false);
}, 1000);
}
})(MyForm);我想在我的App.js (根)组件中传递类似这样的<CreateForm handleSubmit={handleSubmit} />，而不是这样做。有人能给我一个提示吗？
回答 2
Stack Overflow用户
回答已采纳
发布于 2019-06-24 03:54:23
你可以通过props传递一个函数，就像你在问题的末尾所暗示的那样。然后，您可以将withFormik调用包装在CreateForm组件的函数体中，这样就可以将属性传递给CreateForm组件，并让CreateForm控制这些属性如何映射到Formik组件。
例如：
const MyComponent = props => {
function handleSubmit(values, { setSubmitting }) {
// handle
}
return (
<CreateForm handleSubmit={ handleSubmit }/>
)
}
const CreateForm = props => {
const { handleSubmit } = props;
const MyFormWithFormik = withFormik({
// ...,
handleSubmit: handleSubmit,
})(MyForm);
return <MyFormWithFormik/>
}Stack Overflow用户
发布于 2020-06-29 16:19:08
handleSubmit参数集中的第二个参数是formik包。道具被传进了formik袋子。传递到formik包中的道具可以像这样访问：handleSubmit: (values, { props }) => {...your function here}
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/56727226
复制相关文章
相似问题
腾讯云开发者
