vue3VueX中的计算属性getters

在vuex中使用计算属性，如在stre文件夹下的index.js里

 

 使用getters

 

 然后在要调用vuex的页面里面直接调用这个方法就可，得到这个结果

 

 这是获取每个自乘的值

把数组里的每一项相加，获得总价要这样写

 

 使用过滤，然后把这个方法返回给要调用的页面

 

 计算属性的方法怎么调用其它方法

 

 这里我写了一个返回小于20价格的方法，如果我们要计算小于20的总价

可以改造刚才的计算总价

    totalprice(state,getters){
      return getters.goodsnum.reduce((s,n)=>s+n.price,0); //
    },
      
    //getters是我们现在使用的计算属性，里面包含了所以已经写了的方法可以调用
    //state是在Vuex里声明的变量

　　我们可以在括号里调用getters使用其方法

 

 如果我们要定义小于多少或大于多少的总价可以把n.price<20的20换成一个变量，但调用的方法只能传两个参数

我们可以这样写

 

 在方法里传入要小于或大于30价格的书

    goodsself(state,getters){
      return function(price){ //可以自定义参数
        return state.cartList.filter(n => n.price <price)
      }
      // return price => state.cartList.filter(n => n.price <price)    
      //另一种写法
    },    

可以在方法写再返回一个方法接收我们传入的参数30