[vue] vuex getters

getters的使用

1. 概念：当state中的数据需要经过加工后再使用时，可以使用getters加工。
2. 在​​store.js​​中追加​​getters​​配置
3. 组件中读取数据：​​$store.getters.bigSum​​

Count.vue

<template>
  <div>
    <h1>当前值为: {{$store.state.sum}}</h1>
    <h2>数值放大{{$store.getters.bigSum}}</h2>
    <List/>
  </div>
</template>

store/index.js

import Vue from 'vue'
import Vuex from 'vuex'
 
Vue.use(Vuex)
 
export default new Vuex.Store({
    state:{
        sum: 1
    },

    getters: {
        bigSum(state) {
            return state.sum * 10
        }
    }
})



//创建并暴露store
export default new Vuex.Store({
    actions,
    mutations,
    state,
    getters
})