Проверка правильности в редуксе

Question

Рассматривая такой редуктор (я использую библиотеку redux-action )

export const reducer = handleActions({
  [REMOVE_CATEGORY]: (state, action) => ({
    ...state,
    // Do other stuff...
  }),
  [TOGGLE_CATEGORY]: (state, action) => {
    const category = action.payload.category
    const selectedCategory = _.findWhere(state.categories, {name: category.name})
    const activeCategories = _.filter(state.categories, {active: true})

    if (activeCategories.length < 4 && selectedCategory.active === true) {
      return {
        ...state,
        didToggleFail: true
      }
    }

    return {
      didToggleFail: false,
      isRequesting: false,
      categories: state.categories.map(
        category => category.name === action.payload.category.name ? {...category, active: !category.active} : category
      )
    }
  },
  [OTHER_ACTION]: (state,action) => ({
    ...state, 
    // Do other stuff..
  })
})

Я сталкиваюсь с простой проблемой, которая может быть связана с моим плохим подходом к решению.;

Каждый action в моем редукторе в основном распространяет ранее существовавшее состояние, но есть поле didToggleFail, которое устанавливается на основе различных условий.

Теперь моя проблема: didToggleFail, который я использую для синхронной проверки, будет находиться в моем состоянии навсегда до тех пор, пока не будет сброшено.

Я использую didToggleFail внутриcomponentDidUpdate вот так:

componentDidUpdate() {
if(this.props.reducer.didToggleFail)
   showError() 
}
...

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

Как справиться с этой ситуацией?

Answer 1

Я предполагаю, что после отображения ошибки пользователю будет предоставлена ​​возможность закрыть ее (или автоматически закрыть после истечения времени ожидания).В этот момент отправьте еще один UNSET_TOGGLE_FAIL, чтобы установить для didToggleFail значение false.Это должно предотвратить несколько триггеров.

Но оптимальное решение зависит от того, что делает showError().Это метод рендеринга или другая редукционная операция.Если это чистый рендер, я бы предложил перемещаться внутри render компонента, так как componentDidUpdate будет вызываться после каждого повторного рендеринга, и если вы не сбросите didToggleFail, это может привести к циклу.