Ввести окончательную форму.Как установить значение поля из состояния компонента

Question

Я пытаюсь добавить средство выбора даты на свой форум.Проблема в том, что средство выбора даты работает только через состояние компонента.Это означает, что выбранные значения переходят в состояние.

Я пытаюсь заставить поле окончательной формы использовать это значение состояния.Но я не могу понять это.

В основном пытаюсь это сделать:

<Field name="field1" value={this.state.date}/>

Answer 1

Вы имеете в виду, что у вас уже есть компонент выбора даты, для которого вы хотите, чтобы response-final-form могла получить доступ к состоянию этого компонента?Если это так, рассматривали ли вы возможность использования версии render-props компонента Field?

В вашей форме это будет выглядеть следующим образом:

<Field name="datePickerField">
  {({ input }) => (
    <DatePickerComponent
      onChange={date => input.onChange(date)}
    />
  )}
</Field>

, а затем внутри DatePickerComponent - где вы обрабатываете состояние настройки для выбранной даты, вы также вызываете props.onChange(date).

Answer 2

Хммммм, я собираюсь предположить, что вы не хотите устанавливать начальное значение, которое конечный пользователь может изменить.Пожалуйста, дайте мне знать, если это не так.

Если вы не хотите форсировать значение, не используйте поле.React-final-form поддерживает состояние, поэтому вам не нужно.

Чтобы установить начальное значение, используйте свойство initialValues ​​в элементе управления Form.

 <Form
      onSubmit={onSubmit}
      initialValues={{ field1: "2019-02-02" }}
      render={({ handleSubmit, form, submitting, pristine, values }) => (
        <form onSubmit={handleSubmit}>
          <div>
            <label>Feild One</label>
            <Field name="field1" component="input" type="date" />
          </div>
          .
          .
          .