重构减脂器

Question

我正在使用类似 React 的方法处理我的项目，我的问题是我的 reducer 相当 "flat"，但它们需要处理不同状态树区域中的许多更新，所以它们越来越越来越复杂。

例如，在调度操作 'DO_SOMETHING' 之后，首先我需要在 3 LOC 内更新我的状态，但是当项目增长并且我需要处理其他功能时，有人想查看基本结果+ 执行相同操作后的额外内容。所以你可以想象，在花费数周时间后，reducer 正在变得 'fat' ，它们以相同的纯粹方式触及同一棵树的许多不同区域，但是很难在它们内部正确地构建代码（一棵州树和一家商店）。

在大多数教程中，我只能找到给定的场景：

调度'ADD_TODO'
更新状态，将新的待办事项添加到待办事项数组中

而我的情况是：

case SELECT_FILTER:
    return Object.assign({}, state, {
        oneProperty: ...,
        anotherProperty: null,
        nextProperty: false
        // and the logic is getting bigger and bigger
    })

调度'SELECT_FILTER'
更新已应用的过滤器部分（UI 已应用过滤器的摘要）
更新将用于从服务器获取数据的查询
清除这个
复制那个
下个月这个过滤器也应该...

:/

我已经尝试创建 "sets of reducers" - 过滤器缩减器、列表缩减器等，但问题是我在同一页面上工作，并且传入的功能引入了横切更改。简单的分组在较小的应用程序中是可以的，但现在每个 reducer 似乎对我的状态的太多部分感兴趣。

所以我的问题是如何正确构建我的减速器？也许我在状态树中放了太多 "local state" ？或者是其他东西？我期待看到您与组合和构造 reducer 相关的解决方案。

Answer 1

方便的是，去年我为 Redux 文档写了一个名为 "Structuring Reducers" :) . It demonstrates several useful techniques for organizing and composing reducer logic. In particular, you might be interested in the sections on "Beyond combineReducers" and "Reusing Reducer Logic" 的部分。

我的"Practical Redux" tutorial series also demonstrates some more advanced reducer structures, particularly the post Practical Redux, Part 7: Form Change Handling, Data Editing, and Feature Reducers.

也可能值得考虑分派多个 "primitive" 可以按顺序分派的动作以形成更大的行为。例如，您可能有一个连续分派 BASIC_UPDATE、SPECIFIC_EXTRA_UPDATE_1 和 SPECIFIC_EXTRA_UPDATE_2 的 thunk。有一些关于性能的问题需要注意，但这是一种有效的方法（并且性能问题可以通过各种批处理策略来解决）。有关详细信息，请参阅我的 Redux 插件目录 dispatching multiple actions and reducing store notification events, my blog post Idiomatic Redux: Thoughts on Thunks, and the Store#Store Change Subscriptions 部分的 Redux 常见问题条目。

重构减脂器

Refactoring fat reducers

refactoring

state

redux