bmvantunes / youtube-2020-june-multi-step-form-formik

A repository with a multi-step form using Formik, Yup and Material-UI
https://youtu.be/l3NEC4McW3g
MIT License
101 stars 68 forks source link

how to use setFieldValue() inside FormikStep component #16

Closed SakhriHoussem closed 3 years ago

SakhriHoussem commented 3 years ago

in my case i need to change a lot after check a box so 👍🏻

 <Field
      name={`categories[${j}].choice`}
      type="checkbox"
      value={choice["@id"]}
      component={CheckboxWithLabel}
      Label={{ label: choice.label }}
      onChange={val => {
           setFieldValue(`categories[${j}].choice`, val);
           setFieldValue(`categories[${j}].question`, question["@id"]);
           setFieldValue(`categories[${j}].user`, `/api/users/${user.id}`);
           setFieldValue(`categories[${j}].compaign`, `/api/compaigns/${user.id}`);
       }}
  />

how to use it and thnx

Oumaima-abm commented 3 years ago

Did you find a solution? I'm facing the same problem

SakhriHoussem commented 3 years ago

clone the current child component and pass setFieldValue as props

<Stepper activeStep={step} orientation="vertical">
   <Step key={child.props.label} completed={step > i || completed}>
     {React.cloneElement(currentChild, { setFieldValue: setFieldValue })}
  </Step>
</Stepper>

or use useContext hook