各种基本步骤,比如下载,导入,挂载,都在 Vuex基本使用 中。仅有一个store
先创建一个store实例
const store=Vuex.Store({})
实例(仅有一个store),里面的state用来保存数据,获取数据就是this.$store.state
Getters: 相当于vue中的computed计算属性,getter的返回值会根据它的依赖被缓存起来,且只有当它的依赖值发生改变才会被重新计算,getter用于监听state中的值得变化,返回计算后的结果。
Mutations: 如果需要修改store中的值唯一的方法就是提交mutation来修改,在这个属性中定义你需要操作数据的方法。比如:你想实现按钮加减1,点击按钮执行操作就是直接提交到mutations中的修改操作的方法。
Actions: 官方并不希望我们这样直接去修改store里面的值,而是让我们去提交一个actions,在actions中提交mutation再去修改状态值。(在组件中的methods中通过使用dispatch来提交actions)
总结
:就是在组件中的methods
中自定义的方法中通过dispatch
提交到actions
中,然后再通过actions
中定义的方法通过commit
提交到mutations
触发相应的方法,来修改数据。
看例子