在另一个字段中调用form.change(fieldName，value)不会更改fieldName字段

Question

我正在尝试将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组件的情况下，它不会在region字段更改时刷新countries字段。

我的问题是，我不知道这是在Form中使用subscription属性时出现的错误，还是我错误地使用了form.onChange函数。

Answer 1

我的代码中肯定有一个错误，Field组件订阅了对其自身名称的更改