Vuex系列之(七)getters配置项

getters配置项

  1. 概念:getters配置项并不是必须要使用的,当state中的数据需要经过加工后再使用时,可以使用getters加工。

  2. 应用场景:运算逻辑复杂而且需要复用,用于抽取基于state中数据的公共运算

  3. store.js中追加getters配置

    ......
    // 准备getters——用于加工state中的数据
    const getters = {
        // state:真正的state
    	bigSum(state){
            // 靠返回值决定自己的值
    		return state.sum * 10
    	}
    }
    
    //创建并暴露store
    export default new Vuex.Store({
    	......
        // 在store中配置getters
    	getters
    })
    
  4. 模板中读取数据:$store.getters.bigSum

注:Vuex中state和getters的关系就类似于Vue中data和computed的关系,state和data是数据源头,getters和computed是拿着数据源头的数据进行的加工。

注:计算属性是当前组件复用复杂运算,getters是跨组件复用复杂运算

posted @ 2024-02-29 20:00  刘二水  阅读(43)  评论(0)    收藏  举报