vuex中getter的用法

 在vuex中getter相当于计算属性
   1.在store.js中写上：
    import Vue from 'vue'
    import Vuex from 'vuex'
    Vue.use(Vuex)
    
    export default new Vuex.Store({
      state:{
        count:0,
      },
       mutations:{
        changeCount:function (state,count) {
          state.count=count
          console.log(state.count)
        },
      getters: {
        // 单个参数
        countDouble: function(state){
          return state.count * 2
        },
        // 两个参数
        CountDoubleAndDouble: function(state, getters) {
          return getters.countDouble * 2
        }
      }
    })
2.在组件的页面写：（这里调用的方式有两种）
第一种：
<div class="add" @click="changeCount">＋</div>
  一个参数:{{countDouble}}
  两个参数{{CountDoubleAndDouble}} <br />
</div>
data () {
    return {
      Acount:0,
    }
  },
(............重点............)
countDouble: function(){
   return this.$store.getters.countDouble
},
countDoubleAndDouble: function(){
  return this.$store.getters.countDoubleAndDouble
},
methods:{
    changeCount(){
      this.Acount++;
      this.$store.commit('changeCount',this.Acount);
    }
  }
第二种：
  import { mapGetters } from 'vuex'
 ...mapGetters([
      'countDouble',
      'CountDoubleAndDouble',
    ]),
无论用哪一种结果都是一样的，看个人喜好...........
复制代码