Vuex的getters其实就是全局的一个computed
Vuex 允许我们在 store 中定义“getter”(可以认为是 store 的计算属性)。就像计算属性一样,getter 的返回值会根据它的依赖被缓存起来,且只有当它的依赖值发生了改变才会被重新计算
基本使用
store.js中定义了一个list数组
1 export default{ 2 state:{ 3 list:[‘东‘,‘西‘,‘南‘,‘北‘] 4 }, 5 getters:{ 6 getListenLength(state){ 7 return state.list.length 8 } 9 } 10 }
我们定义了一个getters,返回的是当前的state.list的长度
我们可以在任意一个组件中使用这个getters
1 <div> 2 <ul> 3 <li v-for=‘(item,index) in $store.state.list‘ :key=‘index‘>{{item}}</li> 4 </ul> 5 <div>麻将牌的数量:{{$store.getters.getListLength}}张</div> 6 </div>
和使用state的方法不同的是getters是通过$store.getters获取