Calculated properties for each element in array - vue.js

Question

I have a use case where my data store has an array of products, each with a price and quantity.
What I would like to do is calculate the 'total' for each product (price x quantity). I can do so by created a new computed property which re-calculates the entire array, appending a new property with the total.
The issue is, this requires recalculating every item in the array every time a single item changes.
I could use a component to calculate and display, but I also need to calculate a total (which is the sum of all computed prices on each product).
Is there a more efficient way to do this?
[
{
"Product ID": 1,
"Price": 10,
"Quantity": 5,
"Calculated Total": 50
},
{
"Product ID": 2,
"Price": 12,
"Quantity": 10,
"Calculated Total": 120
}
]

Answer 1

You can use a computed value to map through the original array and sum the values. e.g say the original array is named originalArray, do:
computed: {
computedTotal() {
let sum = 0
originalArray.map(item => sum += item["Calculated Total"])
return sum
}
}