我正在使用Formik,但字段填充验证存在问题。在<Formik>
内部,根据状态,我使用输入来渲染表单。如果未填写字段,请禁用按钮“ next”。如何仅对呈现的字段进行验证?
displayForms = (values, step) => {
const formsComponents = {
1:<Step1 {...values} />
2:<Step2 education={values.education}/>,
};
switch (step) {
case 1:
return formsComponents[1];
case 2:
return formsComponents[2];
default:
return formsComponents[1];
}
};
<Formik
ref={this.resume}
initialValues={this.initialValues}
validate={values => {
if (values) {
return !value ? "Required" : "";
}
}}
render={({ values, isValid }) => {
return (
<Form>
<div className="jobs-resume-panes">
{this.displayForms(
values,
isValid,
this.state.activeStep
)}
</div>
<div className="jobs-resume-controls">
{activeStep === allSteps ? (
<button
onClick={() => this.submitResume(values, isValid)}
>
Save
</button>
) : (
<button
disabled={this.state.isDisabled}
onClick={this.goNextStep}
>
Next
</button>
)}
</div>
</div>
</Form>