vuex或者redux的异步dispatch在哪些场景会用到？

Question

我在开发SPA的时候，如果遇到某个页面或者点击某个按钮需要发起一个异步ajax请求，假如是用axios的话，则我直接在返回的promise对象的两个then回调函数里面手动commit一个同步mutation（vuex），或者dispatch一个同步的action（redux）。
没必要把这个异步获取数据然后赋值给state的逻辑写到action里面然后异步dispatch啊。所以我不是很明白这个异步提交会在何种场景下用到？

我看官网放的那个setTimeout的例子（延时一段时间后再修改state），我同样可以在setTimeout的回调函数里面写同步分发action的操作啊，而不是把整个setTimeout的定时器创建过程都丢到action里面然后再异步分发这个action。

另外我也不太明白为什么vuex官网的https://vuex.vuejs.org/zh/gui... 这个例子会执行失败？

Answer 1

以 Vue 为例。
你确实可以多个实例里发 axios 请求再 commit，但这样容易形成冗余，如果处理目标都是相同的某 state 属性，这些请求不就可以统一写在 action 了，这样在实例里直接 dispatch 就行了，针对 store 数据流的状态变化也更为明确和可预测。
你甚至可以在 action 层面上做一层中间层数据处理，比如数据缓存，根据相关属性判断到底需不需要发送请求来更新修改数据。
同理 Redux+中间件，理念上是差不多的，只是具体实现和自由度不同。