vuex getters 配置项

getters 和 commit,dispatch 一样，它也是一个 store 全新的配置项，它不像 actions，mutations，state 一样是必须要使用的配置项

如果逻辑复杂并且还想要复用，那么推荐使用 getters，一般用于将 state 中的数据进行加工

下面通过案例引出

编写案例

现在有一个需求，要对 sum 的值放大十倍

直接实现

虽然可以实现

这种虽然可以实现，但是复用性很差

计算属性使用

当然也可以通过计算属性实现

但是计算属性只适用于当前组件，不能跨组件

getter 实现

这种情况最好的办法就是使用 getter 实现

定义 getters

首先在 store 里面定义 getters，在里面进行逻辑处理，它有一个参数是 state，里面有存放的数据，通过 return 返回最终处理好的结果

配置 getters

定义好 getters 之后，就可以在 store 中配置了

这时候 bigSum 这个 getter 配置项就可以使用了

使用 getters

直接使用 store 里面的 getters 配置项的 bigSum 函数即可获取到返回值

总结

1. 概念：当 state 中的数据需要经过加工后再使用时，可以使用 getters 加工。

2. 在store.js中追加getters配置

......
const getters = {        bigSum(state){                return state.sum * 10        }}
//创建并暴露storeexport default new Vuex.Store({        ......        getters})

3. 组件中读取数据：$store.getters.bigSum
   

1. 概念：当state中的数据需要经过加工后再使用时，可以使用getters加工。
2. 在store.js中追加getters配置
  //js代码
      const getters = {           bigSum(state){                   return state.sum * 10           }   }      //创建并暴露store   export default new Vuex.Store({           ......           getters   }) 
3. 组件中读取数据：$store.getters.bigSum