sum object values in separate array in vue js

Question

im new in VueJs and i have on object that includes some array in there like below and i want to show sum off all amount in one of the column table my table :

<tr v-for="(transaction,index) in transactions" >

<td>{{ index }}</td>

<td>show sum of all amount here</td

</tr>

and transaction is :

026b148e-c7dd-4891-b4d1-15a492c971a4: [
{
id: 106,
type: "income",
created_at: "2020-06-28 13:44:08",
updated_at: "2020-06-28 13:44:08",
amount: 10,
description: null,
type_of_pay: "group",
invoice_number: "026b148e-c7dd-4891-b4d1-15a492c971a4",
},
{
id: 107,
type: "income",
created_at: "2020-06-28 13:44:08",
updated_at: "2020-06-28 13:44:08",
amount: 1,
description: null,
type_of_pay: "group",
invoice_number: "026b148e-c7dd-4891-b4d1-15a492c971a4",
package: {}
}
],

how can i do what i want simple and clear?

Prashant · Accepted Answer · 2020-06-28 11:58:46Z

1

Create a computed property called sum that returns the sum of all transactions and use that in the template may be?

computed: {
    sumOfTransactions() {
        return this.transactions.reduce((sum, transaction) => {
            return sum += transaction.amount;
        }, 0);
    }
}

And, use that in the template as

<td>{{ sumOfTransactions }}</td>

answered Jun 28, 2020 at 11:58

Prashant

8,1503 gold badges27 silver badges25 bronze badges

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

2 Comments

Amirali Over a year ago

thank to you but i do it before and i have this error: TypeError: this.transactions.reduce is not a function, each transaction have many object in there @prashant

LLai Over a year ago

@Amirali reduce is an array function, since transactions is an object you'll first need to grab the object keys Object.keys(this.transactions)...

Collectives™ on Stack Overflow

sum object values in separate array in vue js

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related