vuexにおける補助関数(mapState,mapGetters,mapMutations,mapActions)

くだらないことを言わずに直接:mapStateとmapGettersは計算属性computedに配置します.これらの補助関数を使用するには、まず次の手順に従います.

import { mapState，mapMutations } from 'vuex'

computed: {
  localComputed () { /* ... */ },
  //                      
  ...mapState({
    // ...
  })
}

mapMutationsとmapActionsはmethodsに入れます.

export default {
  // ...
  methods: {
    ...mapMutations([
      'increment', //   `this.increment()`     `this.$store.commit('increment')`

      // `mapMutations`      ：
      'incrementBy' //   `this.incrementBy(amount)`     `this.$store.commit('incrementBy', amount)`
    ]),
    ...mapMutations({
      add: 'increment' //   `this.add()`     `this.$store.commit('increment')`
    })
  }
}

もちろん導入する必要があります.

import { mapState，mapMutations } from 'vuex'