Javascript 如何在Vue.js中获得false或true值的总和

我从这个数组中得到金额的总值，但我只想要支付值：false或支付值：true的总和

var app = new Vue({
    el: "#root",
    data: {
      payments: [
        { name: "Rent", amount: 10000, paid: true },
        { name: "Gas Bill", amount: 900, paid: true },
        { name: "Water Bill", amount: 200, paid: false },
        { name: "Net Bill", amount: 900, paid: false }
      ]
    },
    computed: {
        totalAmount: function() {
            var sum = 0;
            for (var i = 0; i < this.payments.length; i++) {
            sum += this.payments[i].amount;
            }
            return sum;
        },

    }
  });

var-app=新的Vue({
el:“根”，
数据：{
付款：[
{姓名：“租金”，金额：10000，已付：真实}，
{姓名：“煤气单”，金额：900，已付金额：真}，
{名称：“水费单”，金额：200，已付：假}，
{名称：“净账单”，金额：900，支付：假}
]
},
计算：{
totalAmount:function（）{
var总和=0；
对于（var i=0；i

这样行吗

计算：{
totalAmount:function（）{
var总和=0；
对于（var i=0；i

这样行吗

计算：{
totalAmount:function（）{
var总和=0；
对于（var i=0；i

您可以根据要计数的值筛选数组，并计算长度：

var-app=新的Vue({
el:“根”，
数据：{
付款：[
{姓名：“租金”，金额：10000，已付：真实}，
{姓名：“煤气单”，金额：900，已付金额：真}，
{名称：“水费单”，金额：200，已付：假}，
{名称：“净账单”，金额：900，已付：假}，
,
{名称：“电汇单”，金额：900，已付金额：真}
]
},
计算：{
TotalAmount（）{
返回此.payments.reduce（（总计，p）=>total+p.amount，0）
},
numberPaid（）{
返回此.payments.filter（p=>p.payments.length）
},
numberNotPaid（）{
返回此.payments.filter（p=>！p.payment）.length
}
}
});

总计：{{TotalAmount}}

已付：{{numberPaid}

未支付：{{numberNotPaid}

您可以根据要计数的值筛选数组，并计算长度：


var-app=新的Vue({
el:“根”，
数据：{
付款：[
{姓名：“租金”，金额：10000，已付：真实}，
{姓名：“煤气单”，金额：900，已付金额：真}，
{名称：“水费单”，金额：200，已付：假}，
{名称：“净账单”，金额：900，已付：假}，
,
{名称：“电汇单”，金额：900，已付金额：真}
]
},
计算：{
TotalAmount（）{
返回此.payments.reduce（（总计，p）=>total+p.amount，0）
},
numberPaid（）{
返回此.payments.filter（p=>p.payments.length）
},
numberNotPaid（）{
返回此.payments.filter（p=>！p.payment）.length
}
}
});

总计：{{TotalAmount}}

已付：{{numberPaid}

未支付：{{numberNotPaid}

也许这更像vue


var-app=新的Vue({
el:“根”，
数据：{
付款：[
{姓名：“租金”，金额：10000，已付：真实}，
{姓名：“煤气单”，金额：900，已付金额：真}，
{名称：“水费单”，金额：200，已付：假}，
{名称：“净账单”，金额：900，支付：假}
] 
},
计算：{
总计：函数（）{
设总和={总计：0，已付：0，未付：0}
this.payments.forEach（付款=>{
总额+=付款金额；
已支付金额+=已支付金额？已支付金额：0；
金额.未付+=付款.已支付？0：付款.金额；
});
返回Object.entries（sums.map（（ent）=>`${ent.join（“：”}'）.join（“\n”）；
}  
}
})
.pre{
空白：预包装；
单词包装：打断单词；
字体家族：继承；
}

{{total}
也许这更像vue


var-app=新的Vue({
el:“根”，
数据：{
付款：[
{姓名：“租金”，金额：10000，已付：真实}，
{姓名：“煤气单”，金额：900，已付金额：真}，
{名称：“水费单”，金额：200，已付：假}，
{名称：“净账单”，金额：900，支付：假}
] 
},
计算：{
总计：函数（）{
设总和={总计：0，已付：0，未付：0}
this.payments.forEach（付款=>{
总额+=付款金额；
已支付金额+=已支付金额？已支付金额：0；
金额.未付+=付款.已支付？0：付款.金额；
});
返回Object.entries（sums.map（（ent）=>`${ent.join（“：”}'）.join（“\n”）；
}  
}
})
.pre{
空白：预包装；
单词包装：打断单词；
字体家族：继承；
}

{{total}}
您真的需要为此计算属性吗？是的。我得到了答案。谢谢。你真的需要一个计算属性吗？是的。我得到了答案。谢谢。工作，但优雅和“vue”-比如？我认为我的更优雅一点-至少努力保持vue精神我认为我的可以被任何人理解。（开玩笑）工作，但优雅和“vue”-比如？我觉得我的更优雅一点