时间戳

首页 > 解决方案 > 如何为 Redux 中的一组组合 reducer 制定规则？

javascript - 如何为 Redux 中的一组组合 reducer 制定规则？

问题描述

我有两个看起来像这样的标准减速器

减速机1

const reducer1 = (state, action) => {
  switch(action.type) {
    case('clear'):
      return {
        ...state,
        reducer1property1: null
      }
    ...<other cases>...
  }
}

减速机2

const reducer2 = (state, action) => {
  switch(action.type) {
    case('clear'):
      return {
        ...state,
        reducer2property1: null
      }
    ...<other cases>...
  }
}

因此，如果我调度一个“清除”类型的操作，那么 property1 将在两个减速器中被清除。

我像这样组合减速器：

const combinedReducer = combineReducers({
  Reducer1,
  Reducer2
})

我的问题是：有没有办法做到这一点，而无需分别在每个减速器中编写“清晰”案例？例如，有没有办法添加“清除”案例combinedReducer，以便我只能写一次？在我的实际应用程序中，有更多的减速器，所以我希望简化。

谢谢！

标签： javascriptreactjsreact-nativeredux

解决方案

这就是“高阶reducer”概念的用武之地。如果功能很常见，只需编写一次，然后使用该reducer“包装”任何其他需要该行为的reducer。在您的情况下，类似于：

const rootReducer = combineReducers({
    reducer1 : closeable(reducer1),
    reducer2 : closeable(reducer2),
});

有关更多详细信息，请参阅有关“重用 Reducer Logic”的 Redux 文档页面、有关The Power of Higher Order Reducers 的幻灯片以及有关Redux Reducers 和 Selectors的其他一些文章。

推荐阅读