React/Redux 如何等待调度的动作完成？

Question

在我的 thunk 中，我在一个名为 dispatches 的数组中有两个调度，它们修改了 Redux 存储。只有在它们都完成之后（即修改了 Redux 存储），我才想调度 finalDispatchCall。我尝试将它们都放在Promise 中并调用then，但我仍然看到finalDispatchCall 是在secondDispatchCall 更新Redux 存储之前创建的。

const dispatches = [];
dispatches.push(dispatch(firstDispatchCall());
dispatches.push(dispatch(secondDispatchCall());
Promise.all([...dispatches]).then(() => {
 dispatch(finalDispatchCall());
})
.catch(error => {
 logger.error(
  `Print out error - ${error}`
 );
});

有没有办法在调用另一个调度之前确保调度已经完成？

编辑（更多细节）：

firstDispatchCall 正在进行 API 调用（返回 fetch）并在 then 语句中调度操作以更新 redux 存储。 secondDispatchCall 还在进行 API 调用（返回 fetch）并在其 then 语句中分派另外两个操作，每个操作都进行自己的 API 调用并分派操作以更新 redux 存储。

我想等到所有这些都完成后再制作finalDispatchCall。

Answer 1

只要firstDispatchCall() 和secondDispatchCall() 是同步的，redux 就保证它们将按顺序同步到达，并且随后对dispatch() 的调用将作用于更新的状态。但是，如果您想绝对确定，您可以使用store.subscribe()，在程序上等待您期望的所有更改，并阅读每个更改的商店以确认它们都在那里。如果第一个和第二个 DispatchCall 是异步的，这实际上是必不可少的。

但是，问题是您是否真的需要从那个特定的 thunk 中知道所有调度何时到达。 Redux 是一个事件总线，因此提供了许多方法来给异步猫换肤。通过等待这些调度以调度最后一个调度，这可能有助于更多地了解您试图解决的问题。可能你真的不需要这样做......

我建议阅读 Redux 团队对这个确切问题的看法："Should I dispatch multiple actions in a row from one action creator?"。特别注意那里：

“一般来说，询问这些动作是否相关但独立，或者 实际上应该表示为一个动作。”

Redux 的新手经常使用多个操作来完成一个操作，因为他们忘记了多个 reducer 都可以监听同一个操作。