vuex学习---mutation

更改vuex中的store中的状态的唯一方法是提交mutation,

Mutation 必须是同步函数 

store中的mutation代码如下;

vuex学习---mutation

.vue页面中的代码如下;当点击按钮的时候,执行方法increment,通过this.$store.commit('increment') ,然后执行mutation中的increment方法,改变state中的count,页面中的count数值也会自动改变;vuex学习---mutation

点击按钮,前面的数字会增加;

也可以在执行commit方法时,提交参数,例如:点击减少按钮时,执行uncrement方法,执行里面的this.$store.commit(),第二个参数就是传递的参数,

vuex学习---mutation 

执行该方法后,会执行mutation中的uncrement方法,

vuex学习---mutation

提交mutation的另一种方式:是对象风格,

vuex学习---mutation 

Mutation 必须是同步函数 

提交mutation时,还可以借助辅助函数,mapMutations ;

vuex学习---mutation