时间戳

首页 > 解决方案 > react-redux 钩子中的顺序调度操作

react-redux - react-redux 钩子中的顺序调度操作

问题描述

我正在使用 useDispatch() 函数向我返回一个调度对象来触发一些操作。

我有一个特殊的场景，我想触发一个拒绝操作来取消用户的请求，并且在从服务器返回响应（无论它是否成功）之后，我将决定是否应该触发另一个操作。

我的方法如下所示：

const reject = () => {
  dispatch(method1(data));
  dispatch(fetchAll());
}

当我观察我的开发者控制台上的日志时，两者method1()都会fetchAll()在不等待响应的情况下启动。

在处理 fetchAll() 之前，如何确保 method1() 返回某个值？

标签： react-reduxreact-hooksdispatch

解决方案

你需要使用redux-thunk中间件。看看作文

Redux Thunk 中间件允许您编写返回函数而不是操作的操作创建器。thunk 可用于延迟动作的分派，或仅在满足特定条件时分派。

然后您可以像这样发送操作：

const reject = () => {
  dispatch(method1(data)).then(res => {
    if(res.success) {
      dispatch(fetchAll());
    }
  })
}

推荐阅读