vuex api 使用

1.State存储应用层的数据状态

 //创建一个 store
 const store = new Vuex.Store({
    //state存储应用层的状态
    state:{
        count:5  //总数：5
    }
 });

2.mutations是修改state中数据的唯一途径（actions 处理异步场景，mutations处理同步场景）

 const store = new Vuex.Store({
    //state存储应用层的状态
    state:{
        count:5  //总数：5
    },
    // mutations是修改state中数据的唯一途径
    mutations:{
        increment(state，value){
            state.count += value;
        }
    }
 });

3.修改值（同步）：this.$store.commit("increment", 1)

等于

             （异步）： this.$store.dispatch("increment", 1) ;

参数1：increment方法名（修改count值的方法）

参数2：要修改的新值。

4.取值：this.$store.state.count

5.getters：在State和组件之间添加一个环节（对state中的数据进行加工处理后再提供给组件）

• 先定义getters

// getters的主要应用场景：模板中需要的数据和State中的数据不完全一样
// 需要基于state中的数据进行加工处理，形成一份新的的数据，给模板使用
getters: {
    getPartList (state) {
        return state.list.filter(item => {
            return item.id > 1
        })
    }
}

• 再使用getters

this.$store.getters.getPartList