Vuex中的方法

getters的使用

      1、概念：当state中的数据需要经过加工后再使用时，可以使用getters加工。

      2、在store.js中追加getters配置

        const getters = {

            bigSum(state){

              return state.sum * 10

            }

        }

        //创建并暴露store

        export default new Vuex.Store({

            ...

            getters

        })

      3、组件中读取数据：$store.getters.bigSum

四个map方法的使用

      1、mapState方法： 用于帮助我们映射state中的数据计算属性

        computed:{

            //借助mapSate生成计算属性 (对象写法)

            ...mapState({sum:'sum'})

            //数组写法

            ...mapState(['sum'])

        }

      2、mapGetters方法： 用于帮助我们映射getters中的数据为计算属性

        computed:{

            //借助mapGetters生成计算属性 (对象写法)

            ...mapGetters({bigSum:'bigSum'})

            //数组写法

            ...mapGetters(['bigSum'])

        }

      3、mapActions方法： 用于帮助我们生成与actions对话的方法，即：包含$store.dispatch(xxx)的函数

        methods:{

            //靠mapActions生成incrementOdd、incrementWait方法（对象形式）

            ...mapActions({incrementOdd:'jiaOdd',incrementWait:'jiaWait'})

            //数组写法

            ...mapActions(['incrementOdd','incrementWait'])

        }

      4、mapMutations方法：用于帮助我们生成与mutation对话的方法，即：包含$store.commit(xxx)函数

        methods:{

            //靠mapActions 生成：increment，decrement（对象形式）

            ...mapMutations({increment:'JIA'，decrement:'JIAN'})

            //数组写法

            ...mapMutations(['JIA','JIAN'])

        }