Question

我遇到过两个来源，其中解释了如何一起使用两个中间件系统。

第一个说：

您可以将saga中间件添加到thunk中间件旁边。请记住，列出中间件的顺序很重要。

代码：

<div class="container split-horizontal">
  <div class="widget w1"></div>
  <div class="widget w2"></div>
  <div class="widget w3"></div>
  <div class="widget w4"></div>
  <div class="widget w5"></div>
  <div class="widget w6"></div>
  <div class="widget w8"></div>
</div>

第二个提供了这段代码source2：

const store = createStore(reducer, applyMiddleware(thunk, sagaMiddleware))

可以吗？还是第一个只是提醒我们顺序很重要，但是在createStore(rootReducer,applyMiddleware(sagaMiddleware, thunk)和saga之间的顺序没关系吗？也许还有其他原因要警告相对thunk和saga的订单？

Answer 1

是的，您绝对可以同时使用两种中间件。

排序很重要，因为中间件流水线顺序基于applyMiddleware()的参数顺序。就是说，当您有一个调用next(action)的自定义中间件时，这是一个主要问题，该中间件将操作转发到管道中的下一个中间件。通常，在使用thunk和sagas时，您会调用dispatch(action)，它总是从管道的开头开始。

有关更多详细信息，请参见the Redux FAQ entry on "what is the difference between next and dispatch in a middleware?"。

Answer 2

您可以使用saga api中的putResolve

putResolve(action)
Just like put but the effect is blocking (if promise is returned from dispatch it will wait for its resolution) and will bubble up errors from downstream.

https://redux-saga.js.org/docs/api/ 由于redux-thunks返回了promise，因此您可以直接在sagas中调用它们，然后等待返回值。此外，它还会冒出任何错误。

同时进行redux-thunk和redux-saga

2 个答案: