React-Redux：我把使用部分reducer的副作用放在哪里？

Question

我知道不要把副作用放在reducer中，我也知道有很多关于如何处理异步操作的精彩解释。我已经读过了。我有一个特殊的问题，我被绊住了。谢谢！我有一个具体的问题，我被搞糊涂了。

我有 state.largeObject 是一个有许多条目的对象。我有一个还原器，它可以做一些复杂的逻辑，并将结果合并到 state.largeObject 像这样。

export const myReducer = (state, { input }) => {
  const largeObject = doSomethingComplex(input)
  // other logic that uses largeObject

  return {
    ...state,
    largeObject: {
      ...state.largeObject,
      ...largeObject
    }
  }
}

我想保存以下结果 doSomethingComplex(input) 到服务器。副本效果放在哪里？ 编辑：在不重复的情况下 doSomethingComplex 在减速器中的其他逻辑仍然需要它。

• 我不能把它放在 myReducer 或 doSomethingComplex 因为它们是纯粹的。
• 我不能把它放在Redux中间件中，因为那只能访问动作和整个状态。我不希望在中间件中调用 doSomethingComplex 在reducer和中间件中都有。
• 我不想把它移到一个动作创建器中，因为那会把很多纯功能强加到一个thunk中，使其更难编写。

我缺少什么？谢谢！我知道不要把副作用放进去。

Answer 1

中间件、thunks和存储订阅回调都是有效的地方。

• 在thunk中加入一些保存逻辑是很好的。 Thunks是中间件的一种，一般来说，副作用就应该存在于此。
• 你可以有一个自定义的中间件，寻找导致这个变化的特定动作类型，或者检查这个状态的块状物是否发生了变化，并在状态更新后对服务器进行调用。
• 你可以有一个存储订阅的回调，检查这个状态块是否发生了变化，并对服务器进行调用。

根据你的措辞，我不确定你是否想发送... ... 只是 调用服务器的结果，或者说是做了 {...state.largeObject, ...largeObject}.

Answer 2

在我看来，最合适的方法是将整个的。减速器 逻 doSomethingComplex 函数）到服务器端。

所以，你要做的就是调度动作并向API发送所需的参数。如果有成功的响应，你就会调度出 成功 行动，号召 myReducer 并将结果保存在商店中。

然而如果你真的想把这个逻辑保留在前端，你必须使用一个中间件--thunks或者sagas（我更喜欢sagas）。

// some pseudo code //

dispatch the action
- inside the middleware - 
  call doSomethingComplex() // called once and stored in some variable
  dispatch action that will call the reducer and store the result
  call API with the result

但我还是推荐第一种解决方案，因为（第二种）方法可以工作，但可能会破坏适当的数据流。

编辑：一些最后的想法--如果你真的想把这些计算留在前端，可以考虑按照策略。

• 派遣行动
• 在中间件中调用调用 doSomethingComplex 功能
• 调用API的 牣 该 doSomethingComplex 返回
• 返回 的 牣 - 该 doSomethingComplex 返回--从API中以 成功 回应
• 称雄 牣 并调用还原器将其保存在存储空间中。

这样才能保持适当的数据流的活力。