首页 > 解决方案 > 想用 useReducer 添加第二个 React reducer

问题描述

我目前有一个减速器,它首先检查是否将 SUCCESS 或 FAILURE 作为操作发送。只有当loading状态为假时,我才希望检查其他操作。我意识到下面的代码不太正确,但只是想粘贴一些内容以了解我要解决的问题。

我觉得不知何故,之后的所有代码if (state.loading === false)都可能在另一个减速器中,但我不知道该怎么做。我尝试了几种错误的方法,并且不断出现奇怪的错误。

const dataLoadingReducer = (state, action) => {
  switch (action.type) {
    case 'FAILURE':
      return {...state,loading: true}
    case 'SUCCESS':
      return {...state, loading: false}
  }
  
  // only do the next set of dispatches if state.loading is true, otherwise ignore
  if (state.loading === false) {
    switch (action.type) {
      case 'SET_YEAR':
        return {...state, year: 'xxx'}
      case 'SHOW_SESSIONS':
        return {...state, year: '111'}
      case 'HIDE_SESSIONS':
        return {...state, year: '222'}
      case 'SHOW_FAVORITES':
        return {...state, year: '333'}
  
    }
  }
};

标签: reactjsuse-reducer

解决方案


你想要单独的减速器吗?如果是这样,请使用combineReducershttps://redux.js.org/api/combinereducers)。

但是,当您调度一个动作时,SET_YEAR您应该期望该动作得到一致的处理。您的减速器中不应出现次要的、错误的或有条件的行为。这可能会导致各种问题。如果由于 的值而不应发生loading该动作,则不应首先分派该动作。Redux reducer 用于状态管理,而不是业务事件/规则的编排。


推荐阅读