4、mapMutations

例子

export default new Vuex.Store({
  state: {
    count:1
  },
  mutations: {
    increase(state){
      state.count++
    },
    decrease(state){
      state.count--
    },
    double_two(state){
      state.count = state.count*2
    }
  },
  modules: {
  }
})

<template>
  <div class="home">
     <p>{{this.$store.state.count}}</p>
     <button @click="add">增加</button>
     <!-- reduce -->
     <button @click="reduce">减少</button>
     <button @click="double">countx2</button>
  </div>
</template>
<script>
export default {
  name: 'Home',
  methods:{
    add(){
      this.$store.commit("increase")
      /* decrease */
    },
    reduce(){
      this.$store.commit("decrease")
    },
    double(){
      this.$store.commit("double_two")
    }
  }
}
</script>

一、使用mapMutations改良上面的例子

可以批量的向vuex的mutations去传递事件

<template>
  <div class="home">
     <p>{{this.$store.state.count}}</p>
     <button @click="increase">增加</button>
     <!-- reduce -->
     <button @click="decrease">减少</button>
     <button @click="double_two">countx2</button>
  </div>
</template>
<script>
import {mapMutations} from 'vuex'
export default {
  name: 'Home',
  methods:{
    ...mapMutations(["increase","decrease","double_two"])
  }
}
</script>