vue3核心概念-Mutation-辅助函数

你可以在组件中使用 this.$store.commit('xxx') 提交 mutation，或者使用 mapMutations 辅助函数将组件中的 methods 映射为 store.commit 调用（需要在根节点注入 store）

辅助函数只能在选项式API中使用

<template>
  <h3>Nums</h3>
  <p>{{ getCount }}</p>
  <input type="text" v-model="num">
  <button @click="addHandler">增加</button>
  <button @click="minHandler">减少</button>
</template>
<script>
import { mapGetters,mapMutations  } from 'vuex'
export default {
  data(){
    return{
      num:""
     }
   },
  computed:{
    ...mapGetters(["getCount"])
   },
  methods:{
    ...mapMutations(["increment","decrement"]),//mapMutations只能在methods中使用
    addHandler(){
      this.increment({
        num:this.num
       })
     },
    minHandler(){
      this.decrement({
        num:this.num
       })
     }
   }
}
</script>