vue.js - 从对象中找到一个值的总和

Question

我正在尝试添加总计的值并找到它们的总和，以显示在视图中，但不知何故它不起作用。

export default {
  data() {
    return {
      invoices: [],
    }
  },

  computed:{
    sum () {
      return invoices.map(function(invoice) {
        return invoice.sum.map((inv) => inv.totale).reduce(function (total, inv) {
          return total + inv
        }, 0);
      });
    }
  },
}

数据图像： 数据

标签： vue.jssum

Answer 1

new Vue({
  el: '#app',
  data() {
    return {
      invoices: [{ totale: 10 }, { totale: 10 }, { totale: 10 }],
    }
  },

  computed: {
    sum() {
      return this.invoices.reduce((acc, { totale }) => acc + totale, 0);
    }
  },
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>

<div id="app">{{ sum }}</div>