Vuex mutitons 和 actions 初使用

Vuex 状态管理

Vuex 依赖于 Vue 用来管理 Vue 项目状态

状态的修改依赖于 commit 和 dispatch

import Vue from 'Vue';
import Vuex from 'Vuex';

export default new Vuex.Store({
    state:{
        count:100
    },
    mutations:{
        change(state,payload){
            state.count += payload;
        }
    },
    actions:{
        change(context,palyload){
            context.commit('change',palyload);// 异步触发 mutaiton
        }
    },
    getters:{
        getCount(){
            return state.count;
        }
    }
})

{{$store.state.count}}
<button @click="commitChange">更改count</button>
<button @click="dispatchChange">更改count</button>

...

methods:{
    commitChange(){
        this.$store.commit('change',1);
    },
    dispatchChange(){
        this.$sotre.dispatch('change',10);
    }
}