Eu faço um formulário stepper formik e o objetivo é sim validar cada etapa do formulário. este é o meu esquema de validação:
const schema = [
yup
.object()
.shape({
field1: yup.string().required("cannot be empty"),
field2: yup.string().required("cannot be empty"),
}),
yup
.object()
.shape({
field3: yup.string().required("cannot be empty"),
field4: yup.string().required("cannot be empty"),
}),
yup
.object()
.shape({
field5: yup.string().required("cannot be empty"),
field6: yup.string().required("cannot be empty"),
}),
];
<Formik
initialValues={initialValues}
validationSchema={schema}
onSubmit={_handleSubmit}
>
{({ isSubmitting, dirty, isValid, values, resetForm }) => (
<Form>
{_renderStepperForm(currentStep)}
<Button
size="sm"
disabled={currentStep === 0}
onClick={goToPreviousStep}
>
Previous
</Button>
<Button type="submit" size="sm" onClick={goToNextStep}>
{currentStep + 1 === stepConstant?.length ? "save" : "Next"}
</Button>
</Form>
)}
</Formik>
mas recebi a mensagem de erro "esquema [(valor intermediário) (valor intermediário) (valor intermediário)] não é uma função". como devo configurar o esquema de validação?
O erro "esquema[(valor intermediário)(valor intermediário)(valor intermediário)] não é uma função" ocorre porque Formik espera um único objeto de esquema de validação, não uma matriz de esquemas. Você precisa combinar todos os seus esquemas individuais em um. Você pode conseguir isso mesclando os objetos na matriz. No seu código, você está passando a matriz de objetos, não objetos singleton que consistem em objetos.
Veja como você pode configurar o esquema de validação corretamente:
Considerando que você pode usar useState se quiser passar a matriz de objetos para validação passo a passo.