Vue.js: How to calculate total of an array field?

Question

I know that my question was asked a few times here, but I didn't find a working solution :(

My array in the data property is currently looking like this:

products: [{
    name: 'Product A',
    price: '10'
}, 
{
    name: 'Product B',
    price: '30'
}, 
{
    name: 'Product C',
    price: '20'
}]

Function to sum up the prices:

sumTotal() {
    let basket_total = [];
    this.products.forEach(val => {
        basket_total += val.price;
    });
    console.log(basket_total);
}

My result is 103020 instead of 60. I also tried other ways, but every time I got the same result. What can I do?

Thanks!

basket_total should be a number, not an array: let basket_total = 0 — jub0bs
– jub0bs, Commented Nov 25, 2019 at 15:47

Marin Terziyski · Accepted Answer · 2019-11-25 15:47:28Z

2

Yes , because you add this values as array items , you should do it :

sumTotal() {
    let basket_total = 0;
    this.products.forEach(val => {
        basket_total += Number(val.price);
       //or if you pass float numbers , use parseFloat()
    });
    console.log(basket_total);
}

answered Nov 25, 2019 at 15:47

Marin Terziyski

2211 silver badge11 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Vue.js: How to calculate total of an array field?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related