如何使用Vuejs对数组中的多个不同对象求和?

时间:2019-06-16 22:36:35

标签: javascript vue.js

我正在开始使用Vue。我正在努力计算数组对象中不同元素的总和。

我的数组如下:

    sites: [{
       sku: 10001,
       name: "Product A",
       totalPrice: '',
       values: [{
          price: 10,
          discount: 5,
          color: "red"
       },
       {
           price: 15,
           discount: 8,
           color: "black"
       }]
    },
    {
      sku: 10002,
      name: "Product B",
      totalPrice: '',
      values: [{
         price: 13,
         discount: 3,
         color: "purple"
       },
       {
           price: 20,
           discount: 5,
           color: "green"
       }]
   }]

我试图对价格求和并将其设置为totalPrice。因此,数组将更改totalPrice,如下所示:

sku: 10001,
      name: "Product A",
      totalPrice: 25,

sku: 10002,
      name: "Product B",
      totalPrice: 33,

我相信我需要使用类似下面的内容来总结它们,但是我不知道该怎么做!

computed: {
    total(){ return this.sites.reduce( (total, item) => item.values. price + total  ,0);}
  },

如何计算价格总和并将其设置为totalPrice?

我曾经旅行过并且找到了类似的线程,但是我无法解决这个问题。

1 个答案:

答案 0 :(得分:1)

computed: {
  total() {
    let newojv = []
    sites.forEach((item, _) => {
      let s = item.values.map((items2, _) => {
        return items2.price;
      })
      let sum = s.reduce((a, b) => a + b);
      newojv.push({
        sku: item.sku,
        name: item.name,
        totalPrice: sum
      });
    });
    return newojv;
  }
}

首先针对下面的每个对象数组

{
  sku: 10001,
  name: "Product A",
  totalPrice: '',
  values: [{
      price: 10,
      discount: 5,
      color: "red"
    },
    {
      price: 15,
      discount: 8,
      color: "black"
    }
  ]
}

然后针对下面的每个对象数组

values: [{
      price: 10,
      discount: 5,
      color: "red"
    },
    {
      price: 15,
      discount: 8,
      color: "black"
    }
  ]

我们用一个映射数组来获取价格值,即10,15。然后我们缩小数组,添加并推入。

let sum = s.reduce((a, b) => a + b);
newojv.push({
    sku: item.sku,
    name: item.name,
    totalPrice: sum
});

一个有效的例子可以是

let sites = [{
  sku: 10001,
  name: "Product A",
  totalPrice: '',
  values: [{
      price: 10,
      discount: 5,
      color: "red"
    },
    {
      price: 15,
      discount: 8,
      color: "black"
    }
  ]
}, {
  sku: 10002,
  name: "Product B",
  totalPrice: '',
  values: [{
      price: 13,
      discount: 3,
      color: "purple"
    },
    {
      price: 20,
      discount: 5,
      color: "green"
    }
  ]
}]
let newojv = []
sites.forEach((item, _) => {
  let s = item.values.map((items2, _) => {
    return items2.price;
  })
  let sum = s.reduce((a, b) => a + b);
  newojv.push({
    sku: item.sku,
    name: item.name,
    totalPrice: sum
  });
});
console.log(newojv)