computed()实战vue3项目计算总价

 // 总价
    const allPrice = computed(() => {
      // 数组过滤，如果data.result中包含当前的item.id，则将当前商品信息放到countList数组中
      let countList = store.state.cartList.filter((item) =>
        data.result.includes(item.id)
      );
      // 总价格
      let sum = 0;
      // 遍历数据 将每一项的价格乘以数量再累加
      countList.forEach((item) => {
        sum += item.num * item.price;
      });
      return sum;
    });

在这个代码片段中，computed是基于store.state.cartList和data.result的变化进行计算的。当store.state.cartList或data.result发生变化时，allPrice会自动重新计算。这个computed属性用于计算购物车中选中商品的总价格。它首先通过过滤函数筛选出包含在data.result中的购物车商品，然后遍历计算每个商品的价格乘以数量，累加得到总价格。