Question

在我的react / redux应用程序中，我经常想要一个接一个地发送多个动作。

给出以下示例：成功登录后我想存储用户数据，然后我想启动另一个从服务器加载应用程序配置的异步操作。

我知道我可以使用redux-thunk来构建像这样的动作创建者

function loginRequestSuccess(data) {
  return function(dispatch) {
    dispatch(saveUserData(data.user))
    dispatch(loadConfig())
  }
}

所以我的问题是：

当第一个dispatch返回时，是否所有针对该操作的Reducer都更改了状态？我想知道两个调度调用是否严格按顺序运行。
此方法是否被视为调度多个操作的最佳做法？如果没有，你还会建议什么？

感谢您的帮助！

Answer 1

是的redux-thunk允许你像你说的那样做，是的，它是调度多个动作的最佳实践（由于它的简单性，我更喜欢替代方案）。一旦你发送（当它返回时），状态确实会更新，这就是为什么你被赋予一个函数来检索thunk中的状态，而不是简单地引用状态。通过这种方式，您可以使用一个调度更改状态，然后调用getState（）以获取对要读取的新状态的引用。

Answer 2

redux-thunk正是您所寻找的。我认为这是非常好的做法。

要回答你的问题，实际上当第一次调度返回时，调用的reducer已经改变了状态。

Answer 3

我知道这是一个迟到的回复:-P你可以通过使用Redux-Thunk并检查Redux-Saga来做到这一点。 Redux Saga提供了一种同时处理大量动作的惊人方式。下面是使用Redux-Thunk

分派多个操作的示例

function getAndLoadSider(moduleName){
    return function(dispatch){
        return doSomeApiCall(someData).then(function(item){
            let _item = someOtherFunction(item.collections);
                let _menuData = {
                    name: item.name,
                    key: item.key
                };
            return new Promise(function(res, rej){
                dispatch(actionOne(_menuData));
                res(_item);
            }).then((_item) =>  dispatch(actionTwo(_item)))
    }
}

当一个动作依赖于第一个动作时，上述方法适用于您的情况。这是一种基于承诺的方法。如果你不想做很多Promise编码，我建议你去Sagas。查看此链接https://redux-saga.js.org/docs/advanced/ComposingSagas.html，在那里您将学习如何撰写传奇。学习曲线陡峭;但是一旦你完成了，Sagas会让你成为忍者减少开发者。

希望这会有所帮助： - ）

如何一个接一个地分派多个动作

3 个答案: