React Redux 在 reducer 或 action-creator 中存储计算？答案

【问题标题】：React Redux store calculations in the reducer or action-creator?React Redux 在 reducer 或 action-creator 中存储计算？
【发布时间】：2019-02-21 02:15:05
【问题描述】：

我正在通过创建一个包含一组基于时间的数据的应用来学习 React 和 Redux：允许的时间和经过的时间。

[1] : {
  time: 10,
  elapsed: 0
},
[2] : {
  time: 15,
  elapsed: 0
},
[3] : {
  time: 20,
  elapsed: 0
}

如果有任何项目超出计划，我想重新计算后续项目的时间。例如。第 1 项允许 10 秒，但如果第 1 项需要 12 秒我想从第 2 项和第 3 项中弥补这段时间。

[1] : {
  time: 10,
  elapsed: 12
},
[2] : {
  time: 14,
  elapsed: 0
},
[3] : {
  time: 19,
  elapsed: 0
}

我应该在哪里执行这个计算？我觉得最简单的地方是减速器，但我也认为减速器应该尽可能简单？对吗？

那么计算是否应该在 action-creator 中进行，然后将一个新的 items 数组传递给 store？

【问题讨论】：

我会亲自在 reducer 中执行此操作，因为那时任何一个值都可能发生变化，因此看起来很合适。我确实想知道您将如何处理将 elapsed 重置为允许值的后续更改，然后您会重置 2 和 3 的值吗？

标签： reactjs redux react-redux

【解决方案1】：

引用原Redux Documentation。

对于 reducer 或 action creator 中应该包含哪些逻辑，没有一个明确的答案。一些开发人员更喜欢拥有“胖”的动作创建者，而“瘦”的减速器只是简单地将数据放入动作中并盲目地将其合并到相应的状态中。其他人试图强调保持动作尽可能小，并尽量减少 getState() 在动作创建者中的使用。（就这个问题而言，其他异步方法，例如 sagas 和 observables 属于“动作创建者”类别。）

在你的 reducer 中加入更多的逻辑有一些潜在的好处。操作类型可能更语义化和更有意义（例如“USER_UPDATED”而不是“SET_STATE”）。此外，reducer 中的逻辑越多，意味着更多的功能会受到时间旅行调试的影响。

【讨论】：

【解决方案2】：

IMO 这应该在减速器中完成。

action 不应该知道 dispatch action 的效果是什么，reducer 负责返回新 state 作为 dispatch action 的效果。

【讨论】：

是的，我必须同意这一点，如果你把逻辑放在 reducer 中，你也遵循 Redux 中心化模式。因此，reducer 中的所有逻辑意味着您可以看到对即将存储的那段数据的全部影响。我感觉模式越好

【解决方案3】：

您可以为此目的使用middleware。

【讨论】：