Поле Formik из вложенного компонента не обновляется - PullRequest
Новая
       4

Поле Formik из вложенного компонента не обновляется

0 голосов
/ 03 февраля 2020

У меня есть следующий сценарий:

  • основной компонент с несколькими полями, которые обрабатывает Formik. Здесь все хорошо.
  • подкомпонент, который визуализируется внутри главной формы и использует компонент Field Formik, так же, как поля в основном компоненте. Эти поля не обновляются.

Основной компонент: 

...
return (
 <Formik
   enableReinitialize
   initialValues={{
     name: this.state.name,
     newName: this.state.newName, // this field is inside the nested component
   }}
   validationSchema={mySchema}
   onSubmit={...}
 >
   {
     ({ errors, values, ... }) => (
       <Form ref={this.formRef}>
         ...
         <Field name="name" type="text" />
         ...
         <NewNameForm />
       </Form>
     )
   }
 </Formik>
);

Компонент NewNameForm: 

...
return (
  <div>
    <Field name="newName" type="text" />
  </div>
);

Мой подход неверный, могу ли я просто вложить компоненты с такими дополнительными полями? newName не обновляется, поэтому я, очевидно, что-то делаю не так.

1 Ответ

0 голосов
/ 04 февраля 2020

Я решил это, передав метод Formik setFieldValue методам подкомпонента следующим образом: 

onNameChange={(name) => {
  setFieldValue('newName', name);
}}
...