上一篇中使用this.$store.state.name='marry';这句代码来直接改变状态name的值,官方不推荐这样直接去修改。
这里使用mutations来修改状态name的值:
store/index.js:
import {createStore} from 'vuex'
export default createStore({
state:{
name:"tom",
},
mutations:{//声明mutations属性
editeName(state,name){//声明一个方法,参数state包括上面的state中的所有数据,name为传入方法editeName的变量
state.name=name;//改变name的值
}
}
});
下面只需要再组件中调用我们再mutations中声明的editeName方法,并且传入参数即可。
组件的js代码中调用这个方法的代码:
this.$store.commit('editeName','jack');