我已经使用withFormik制作了一个Formik表单。在我的handleSubmit中,我触发了一个带有几种情况的SubmitForm函数,每种情况(如果成功)都需要在formik组件中显示一条消息。是否可以在handleSubmit函数中更改多个状态实例?
它需要能够处理多个状态
const formikEnhancer = withFormik({
mapPropsToValues: props => ({
firstName: props.firstName || '',
...
}),
validationSchema: yup.object().shape({
firstName: yup.string().required('Please enter your first name'),
...
}),
handleSubmit: (values, formikBag) => {
submitForm('pass state here?');
}
},
});
const BusinessFundingForm = ({
values,
isSubmitting,
errors,
handleBlur,
handleChange,
handleSubmit,
touched,
data,
}) => {
return (
<Form className="form" id="form-id">
<Row>
<Col xs={12} sm={6}>
<InputField
id="first-name"
type="text"
name="firstName"
value={values.firstName}
onChange={handleChange}
onBlur={handleBlur}
placeholder="First Name"
label="First Name"
/>
{errors.firstName &&
touched.firstName && <Error>{errors.firstName}</Error>}
</Col>
...
</Row>
<Row>
<ButtonWrapper>
<Button
type="submit"
tall
onClick={handleSubmit}
varianttype={
isSubmitting ||
(!!errors.firstName ||
formHelpers.isEmpty(values.firstName))
? 'disabled'
: 'outline'
}
disabled={
isSubmitting ||
(!!errors.firstName ||
formHelpers.isEmpty(values.firstName))
}
text="Submit →"
/>
</ButtonWrapper>
</Row>
</Form>
<Error1 display={false} />
<Error2 display={false} />
</FormGrid>
</Element>
);
};
export default formikEnhancer(BusinessFundingForm);