Question

我有数组。在该数组中，有一个字段名称借方。我想在此数组上添加所有借方并查找总数。我正在尝试通过reduce功能来做到这一点。但是它是将数字加为字符，而不是计算数组号的总和。这是代码

export default {
    data() {
        return {
            fields: {
                debit: 0,
                credit: 0,
                type: '',
            },
            fields: [],
            allDebit: 0,
            allCredit: 0,
        }
    },
    methods: {
        newfield() {
            this.fields.push({
                debit: 0,
                credit: 0,
                type: '',
            })


        },
        dataRemove(index) {
            Vue.delete(this.fields, index);
        },
        calculate() {
            this.allDebit = this.fields.reduce((acc, item) => acc + item.debit, 0);


        }

    }
}

输出：

{
  "fields": [
    {
      "debit": "4",
      "credit": "2",
      "type": ""
    },
    {
      "debit": "4",
      "credit": "2",
      "type": ""
    }
  ],
  "allDebit": "044",
  "allCredit": 0
}

Answer 1

 fields: {
                debit: 0,
                credit: 0,
                type: '',
 },
 fields: [],

您可以在数据中指定对象字段和数组。您不能在对象文字中包含具有两个相同键的对象。那不是有效的JS。如果那是我，我不会感到惊讶。

此外，输出中的值似乎都是字符串。尝试在reduce函数中使用parseInt函数。

Answer 2

将字符串转换为数字，然后求和

 calculate() {
            this.allDebit = this.fields.reduce((acc, item) => Number(acc) + Number(item.debit), 0);


        }

Answer 3

首先将fields重命名为field，或将其彻底删除，但看不到您在哪里使用它。
在累加器中或设置它的地方解析为整数item.debit。

可能的解决方法：

export default {
    data() {
        return {
            field: {
                debit: 0,
                credit: 0,
                type: '',
            },
            fields: [],
            allDebit: 0,
            allCredit: 0,
        }
    },
    methods: {
        newfield() {
            this.fields.push({
                debit: 0,
                credit: 0,
                type: '',
            })


        },
        dataRemove(index) {
            Vue.delete(this.fields, index);
        },
        calculate() {
            this.allDebit = this.fields.reduce((acc, item) => acc + parseInt(item.debit), 0);


        }

    }
}

Answer 4

@api.model
def create(self, values)
    record = super().create(values)
    # create an inventory
    inv_values = {'id_product': record.id, 'qte': 0}
    self.env['inventory.inventory'].create(inv_values)
    return record

数据功能属性中不能有两个相同的键。

Answer 5

我将改为在计算属性中执行此操作，以便在fields发生更改时再次计算该值。

computed: {
   allDebit() {
     return this.fields.reduce((acc, item) => acc + parseInt(item.debit), 0);
   }
}

编辑：数据函数中不能有两个具有相同键的属性。您有两次fields。

如何在Vue.js中计算数字数组

5 个答案: