带有react-country-region-selector的Redux形式的<Fields>在重置选项时出现问题

如何解决带有react-country-region-selector的Redux形式的<Fields>在重置选项时出现问题

我正在使用redux形式的react-country-region-selector。

// MyForm.js
<Fields
   names={['country','province']} 
   component={CountryProvinceDropdown}
/>

这是CountryProvinceDropdown的样子-

// CountryProvinceDropdown.js
import React,{ useState } from 'react';
import { CountryDropdown,RegionDropdown } from 'react-country-region-selector';

export const CountryProvinceDropdown = (fields) => {
  const [country,selectCountry] = useState('');
  const [region,selectRegion] = useState('');

  return (
    <div className='form-row'>
      <div key='country-select' className='form-group col-md-6'>
        <CountryDropdown
          value={country}
          name='country'
          id='country'
          onChange={(val) => fields.country.input.onChange(selectCountry(val))}
          onBlur={(val) => fields.country.input.onBlur(val)}
         />
      </div>
      <div key='province-select' className='form-group col-md-6'>
        <RegionDropdown
          country={country}
          value={region}
          name='province'
          id='province'
          onChange={(val) => fields.province.input.onChange(selectRegion(val))}
          onBlur={(val) => fields.province.input.onBlur(val)}
         />
      </div>
    </div>
  )
}

提交表单时没有错误并且提交成功，一切正常。

但在这种情况下，如果服务器发送错误，则下拉列表将显示国家和省的旧选择以及错误。也可以使用旧选项，但是重新提交表单时，后续提交不会提交国家/省的值。唯一的方法是用户需要再次选择它们。

如果用户必须再次选择相同的值来触发onChange事件，则重置下拉列表不是理想的选择。这样我们就可以让用户选择国家/地区。虽然不确定如何重置，但是更改提交状态会导致无限次重新渲染。

或者理想的情况是重新渲染此组件。感谢您的帮助，因为我是新手。