有条件的 Redux reducer 使用

Posted 2023-02-22

【中文标题】有条件的 Redux reducer 使用

【英文标题】：Conditional Redux reducer usage

【发布时间】：2016-06-05 14:36:42

【问题描述】：

我正在开发一个要管理不同业务子域的应用程序。

域类型在我的商店中。

我创建了特定的组件，根据我的商店状态加载。例如：

let component;
 switch (this.props.somestate.somevar)
 
   case 'business1':
   default:
     component = require('path/to/business1/B1Component').default;
     break;
   case 'business2' :
     component = require('path/to/business2/B2Component').default;
     break;
 
 return <component ...this.props />

但我也想为这些子域使用特定的减速器，仅在需要时由 store.replaceReducer() 加载。

我找到了一种基于路线的方法，例如：How to dynamically load reducers for code splitting in a Redux application?

和上面的例子一样，我想保留所有常见的 reducer，但根据 API 返回的内容添加一些业务特定的 reducer。

但在我的情况下，路由并没有说明涉及哪个子域，我通过 API 调用获取此信息并将其存储在 Redux 存储中。

我应该编写一个中间件来拦截这些信息并在我的商店中调用 replaceReducer 吗？ 我应该直接从高阶组件做吗？ 我想做的是不好的做法/反模式吗？

我不确定这里最好的模式/实践是什么......

【参考方案1】：

由于您正在做的事情有点不寻常，因此这里没有最佳实践或反模式。我会说this approach 对你来说也应该很好用，而且你在哪里调用replaceAsyncReducer（或者你决定叫什么）并不重要。路由处理程序只是一个可能的示例，但可以从相关组件的componentWillMount 执行此操作，或者从您进行 API 调用的任何位置，甚至从专用中间件执行此操作，只要很容易追踪为什么会发生这种情况。由于这有点不寻常，我建议尽可能少的间接，所以从最简单的解决方案开始（在你的情况下，听起来 API 调用是放置它的最佳位置）。

【讨论】：

非常感谢丹。我会试试看效果好不好。