mutation与action
mutation
作用: 更改state的状态
说明: 每个mutation对象都有字符串类型(type)与回调函数,在回调函数内进行状态修改,回调函数的第一个参数为state
eg:
mutations: { changeMainOption (state, index) { state.preMainOption= index; }, changeShade(state, type){ state.mainShade= type; }, changeprePerser(state, _index){ state.prePerser= _index; } }
调用方式:
1.载荷风格
this.$store.commit('changeMainOption', 1)
//index为1
2.对象风格
this.$store.commit({type: 'changeMainOption', anyName: 1})
//index为{type: 'changeMainOption', anyName: 1}
注意:
mutation必须是同步函数,
mutation第二个参数在载荷风格时为commit的第二个参数,对象风格时为commit的对象参数。
action
功能: 提交mutation,可包含异步操作
说明: action函数接收一个与store有相同属性方法的实例context来提交mutation
eg:这
actions: { toChangeMainOption (context){ setTimeout(()=> {context.commit('changeMainOption', 1)}, 1000) }, toChangeMainOption2 ({commit}){ //es6参数解构写法 commit('changeMainOption', 2) } }
调用方式:
1.载荷风格
this.$store.dispatch(''toChangeMainOption", {val: 1})
2.对象风格
this.$store.dispatch({type: ''toChangeMainOption", val: 1})