Vuex 的 actions 应该避免直接操作 state，state 的更改应该由 mutations 去修改，不然 vue-devtools 插件记录不到 state 变更，
actions 可以根据当前 state 进一步处理数据，计算或请求后端接口，然后通过 commit 的形式提交给 mutations 去处理。

本节计数器 actions 部分直接操作了 state ，这个写法有问题，正确代码如下：

复制代码

 increment({commit}) {
  setTimeout(()=>{
    commit('increment')
  }, 3000)
}

源代码及课件地址

https://gitee.com/geektime-geekbang/geektime-vue-1

登录后留言

全部留言(23)

最新
精选

Yrt

置顶

有个问题，为什么在actions 里的increment函数可以直接修改 state.count？我翻了文档，里面说的是在actions里去提交mutations 不让直接更改状态。increment 文档里的传的参数是context 然后视频里传的是state 是因为这个参数的原因吗？

作者回复: 感谢提醒，的确不应该在actions里面去操作state，这样devtools就记录不到变化状态了，传的依然是context哈，注意state两边的大括号，他的作用就是从context里面取出来 state，也是es6的语法，正确代码应该是： actions: { increment({commit}) { setTimeout(()=>{ commit('increment') }, 3000) } },

2019-03-27

3

30

药岩

老师，我想问下，使用vuex的时候有没有必要将所有的state都转化成getter，然后让组件通过mapGetters去获取属性

作者回复: 没必要的，单个状态没有任何意义，涉及到进一步计算合并才使用getter

2019-03-28



3

希望老师能稍微更新快点，我十分感兴趣后面的实战项目。

编辑回复: 下周开始更新实战部分

2019-03-27



2

小霞

为什么const 变量名 = new Vuex.Store({}); 用 this.$变量名就不能拿到定义的数据，但是如果变量名是store就可以呢？

作者回复: 这和你起的名字没关系是vuex内部做的不必纠结这个

2020-04-20



1

qf年间

老师请问为什么要在computed里面获取count值呢，这个是否跟生命周期有关

作者回复: 无关，放在计算属性里面可以很好的响应vuex中数据的变化

2019-12-16

2

1

王永林

感觉不懂node开发学习起来有点吃力，最近搞了好多遍环境，总是因为版本依赖问题最后导致无法运行起来，于是又重新建项目。作为老java开发，也只会在idea下写代码，就是开发用的插件不支持2.6

作者回复: 不应该，版本依赖并不需要自己配置，这也是相对于java的优势，你完全可以不懂node，就可以使用vue

2019-03-28

2

1

刘彪

启动演示DEMO源码出现依赖错误，但是已经安装过core-js了 These dependencies were not found: * core-js/modules/es6.array.find-index in ./node_modules/_cache-loader@2.0.1@cache-loader/dist/cjs.js??ref--12-0!./node_modules/_babel-loader@8.0.5@babel-loader/lib!./node_modules/_cache-loader@2.0.1@

作者回复: 重装试试吧 npm建议使用 taobao 源。

2019-03-27



1

qf年间

有没有什么避免每次都清理缓存刷新页面的方法啊，要不有的时候总抱错

作者回复: 清理缓存？你说的是热更新吧？如果是热更新，没有办法，但也不是每次都需要啊，大部分的改动都可以完美支持的

2019-12-19





Ted

请问下老师使用的命令行工具叫什么？

作者回复: 就是使用系统自带的，mac terminal，如果你也使用的mac，看到的和我不一样，是我自己自定义了主题。

2019-04-02





virtual

$store是通过new Vue.use(Vuex)的时候注入挂载到实例this上面的。在注入的时候通过Vue.mixin()，在生命周期为beforecreate的时候完成的

2020-05-19



21

收起评论

	increment({commit}) {
	setTimeout(()=>{
	commit('increment')
	}, 3000)
	}