Vuex 文档初探(三): Getter

Getter 就是 Vuex 的计算属性. 理解这句话就理解了 Getter, 接下来介绍它的用法.

用法

在 store 内部声明:

getters: {
  xxx(state){ //第一个参数为store里的state
    return state.arr.filter(item => item.truthy)
  },
  yyy(state, getters){ // 第二个参数是其他getter
    return getters.xxx
  },
  zzz(state){ // 传入自定义的参数
    return (param) => state.arr.find(item => item.id === param)
  }
}
 
        Copied!
    

读取结果:

data(){
  return {
    x: store.getters.xxx
    y: this.$store.getters.yyy
  }
}

 
        Copied!
    

或者使用 mapGetters 获取:

import {mapGetters} from 'vuex'
computed: {
  ...mapGetters([
    'xxx', 'yyy'
  ])
}

这里也可以重新命名
computed: {
  ...mapGetters({
    XXX: 'xxx'
  })
}
 
        Copied!