Редукционная форма переустанавливается всякий раз, когда запускается действие по реагированию на обновление - PullRequest
Новая
       45

Редукционная форма переустанавливается всякий раз, когда запускается действие по реагированию на обновление

0 голосов
/ 13 мая 2019

У меня есть приложение и избыточная форма, живущие внутри IntlProvider компонента, подобного этому: 

<IntlProvider>
    <Form />
</IntlProvider>

проблема в том, что всякий раз, когда я пытаюсь изменить значение локали, вызывая действие updateIntl, чтобы изменить приложениеязык, компонент формы приставки перемонтируется снова и сбрасывает все состояния и реквизиты в форме.

Я использую реагировать-intl-redux для вызова updateIntl следующим образом: 

dispatch(updateIntl({ locale: value, messages: translations[value] }))

и это те действия, которые запускаются при изменении значения IntlProvider locale: 

@@intl/UPDATE // here I still have the old state which is the form fields values
@@redux-form/INITIALIZE // here the state starts to reset
@@redux-form/UPDATE_SYNC_ERRORS
@@redux-form/DESTROY
@@redux-form/REGISTER_FIELD

при установке для destroyOnUnmount значения true следующим образом: 

reduxForm({
    form: 'someForm',
    destroyOnUnmount: false,
})

theсостояние формы не сбрасывается, но это не моя проблема, потому что мне нужно для destroyOnUnmount иметь значение true, поскольку у меня подключен маршрутизатор реагирования, и мне нужно инициализировать форму при перемещении между маршрутами.

Я попытался обернутьмоя форма для плагина-редуктора основана на этом решении , но я до сих пор не могу предотвратить вызов действий в форме редукса после вызова @@intl/UPDATE.

1 Ответ

0 голосов
/ 14 мая 2019

Я решил это с помощью обходного решения, сначала я установил destroyOnUnmount в false и добавил новое редукционное действие в плагин api , чтобы форма больше не инициализировалась при монтировании

вот новое действие, в котором я хочу инициализировать свою форму: 

store.dispatch({
  type: 'INITIALIZE_MY_CUSTOM_FORM',
});

и в конфигурации моего магазина: 

const formReducerPlugin = formReducer.plugin({
  customForm: (state, action) => {
    switch(action.type) {
      case 'INITIALIZE_MY_CUSTOM_FORM':
        return {}
      default:
        return state
    }
   }
})


const rootReducers = combineReducers({
  ...reducers,
  form: formReducerPlugin,
});

и моя форма конфигурации такая: 

reduxForm({
    form: 'customForm',
    destroyOnUnmount: false,
})
...