Как рассчитать числа в Vue 2

Question

У меня есть цикл данных, и я хочу вычислить числа своих данных, проблема в том, что я не могу использовать + - в моем калькуляторе, они идут с такими числами, как:

5.000
-2.000
1.000

so result should be 4.000

см. Минус и плюс идут с числами, мне нужно решение для этого.

код

<tbody>
                <tr v-for="(history,index) in histories" @key="index">
                    <td width="50" class="text-center">{{index+1}}</td>
                    <td class="text-center" width="100">
                        {{history.created_at}}
                    </td>
                    <td class="text-center" width="300">Rp. {{ formatPrice(history.balance) }}</td>
                    <td class="text-center">{{history.note}}</td>
                </tr>
</tbody>

PS: мне не нужен * / в моем калькуляторе, простого + - будет достаточно. заранее спасибо.

Answer 1

В разделе methods вы можете выполнить цикл над histories и суммировать значения каждого атрибута .balance:

methods: { 
   calculateTotal: function(histories){
     var sum=0;
     for(var i=0;i<histories.length;i++){
       sum += histories[i].balance;
     }
     return sum;
   }

Затем вы можете использовать его в своем представлении после строк истории:

{{calculateTotal(histories)}}

Примечание : если histories является частью компонента data, вы можете получить доступ к this.histories внутри метода calculateTotal, не передавая его в качестве аргумента.

Теперь метод будет:

calculateTotal: function(){
     var sum=0;
     for(var i=0;i<this.histories.length;i++){
       sum += this.histories[i].balance;
     }
     return sum;
   }

И звонок из вида будет только

{{calculateTotal()}}