Вызов form.change (fieldName, value) в другом поле не меняет fieldName Field - PullRequest
Новая
       20

Вызов form.change (fieldName, value) в другом поле не меняет fieldName Field

0 голосов
/ 28 апреля 2020

Я пытаюсь использовать компонент Form с subscription={{ submitting: true, pristine: true }}, чтобы он не перерисовывал всю форму при каждом изменении. У меня есть поле, которое меняет значение другого в форме. Я ожидаю, что компонент Field будет подписан на изменения его имени. В этом случае он не меняется, и мне нужно обернуть поле с FormSpy. Это не лучшее решение, поскольку FormSpy не может подписаться на одно значение и повторно отображает его дочерние элементы при каждом изменении в values.

Этот код работает, но он не должен нуждаться FormSpy: 

export const CountryForm = ({ regions, countries }) => (
  <Form
    onSubmit={submittedData => {
      console.log({ submittedData })
    }}
    subscription={{ submitting: true, pristine: true }}
    render={({ handleSubmit, form }) => (
      <form onSubmit={handleSubmit}>
        <FormLabel>Regions</FormLabel>
        <FormField
          name="region"
          render={({ input, ...props }) => (
            <Select
              options={regions}
              input={{
                ...input,
                onChange: (selectedRegion: string) => {
                  input.onChange(selectedRegion)

                  const formState = form.getState()
                  const selectedCountries: string[] = formState.values.countries || []
                  const countriesFiltered = filter(countries, {
                    region: selectedRegion,
                  })

                  forEach(countriesFiltered, country => {
                    if (selectedCountries.indexOf(country.code) === -1)
                      selectedCountries.push(country.code)
                  })

                  form.change('countries', selectedCountries)
                },
              }}
              {...props}
            />
          )}
        />
        <FormLabel>Countries</FormLabel>
        <FormSpy subscription={{ values: true }}>
          {() => (
            <Field
              name="countries"
              render={props => <Select options={countries} {...props} />}
            />
          )}
        </FormSpy>
      </form>
    )}
  />
)

Без компонента FormSpy он не обновляет поле sh countries при изменении поля region.

Моя проблема в том, что я не знаю, является ли это ошибкой при использовании свойства subscription в Form или я неправильно использую функцию form.onChange.

1 Ответ

0 голосов
/ 29 апреля 2020

Определенно ошибка в моем коде, Field компонент подписан на изменения под своим именем

...