Redux同步机制疑问：Redux Thunk是否偏离常规dispatch流程？

嘿，咱们一步步来拆解你的问题：

1. 你对Redux基础流程的理解是否有误？ #

你对普通Redux action的同步dispatch流程的理解是完全正确的：

fire action 1 -> store updated -> fire action 2 -> store updated

普通action的dispatch是同步操作，dispatch后reducer会立刻执行，store状态会同步更新，这个过程没有异步延迟。

那为什么你的场景里不符合预期？问题大概率出在你获取store状态的方式，而不是Redux的基础流程本身。

2. Redux Thunk是否脱离了常规dispatch流程？ #

完全没有！Redux Thunk只是一个中间件，它的作用是让你可以dispatch函数（也就是Thunk action），而不是只能dispatch plain object。Thunk的执行完全遵循Redux的dispatch顺序：

• 当你dispatch一个Thunk函数时，Thunk中间件会立刻调用这个函数，并传入dispatch和getState两个参数。
• 这个Thunk函数内部可以同步或异步地dispatch其他action，也可以随时调用getState()获取当前最新的store状态。

你的场景问题分析 #

你在组件里的代码是：

//.... inside component
purchase = () => {
  this.props.addOrder(); // regular action
  this.props.purchase(); // thunk
};
// ... rest of component

如果你的purchase Thunk是依赖组件props来获取订单数据（错误示例）：

// 错误写法：依赖组件props，而非直接从store取最新值
const purchase = (orders) => async (dispatch) => {
  await api.submitCart(orders);
};

// 组件里调用时传入旧的props值
this.props.purchase(this.props.orders);

问题就出在这里：this.props.addOrder()同步更新了store，但React组件的props更新是异步的（React会批量处理状态更新，等到下一次渲染周期才更新props）。所以你调用this.props.purchase(this.props.orders)时，this.props.orders还是更新前的旧值。

正确的做法 #

你的purchase Thunk应该通过getState()直接从store获取最新状态，而不是依赖组件的props：

// 正确写法：用getState获取store最新状态
const purchase = () => async (dispatch, getState) => {
  // 这里拿到的是addOrder更新后的最新orders
  const latestOrders = getState().orders;
  await api.submitCart(latestOrders);
  // 后续可根据API结果dispatch成功/失败action
};

这样，当你先dispatchaddOrder（store同步更新），再dispatchpurchase Thunk时，Thunk内部调用getState()就能拿到最新的orders状态了。

额外验证小技巧 #

如果你想确认store是否真的同步更新了，可以在dispatch之后立刻打印store的状态：

purchase = () => {
  this.props.addOrder();
  // 直接从store实例获取状态（如果组件能拿到store）
  console.log(store.getState().orders); // 这里应该能看到更新后的值
  this.props.purchase();
};

这样就能快速判断是store没更新，还是你获取状态的方式有问题。

内容的提问来源于stack exchange，提问作者bigmadwolf