<template>
  <div>
    <p>总和: {{ totalSum }}</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      items: [
        { id: 1, value: 10 },
        { id: 2, value: 20 },
        { id: 3, value: 30 }
      ]
    };
  },
  computed: {
    totalSum() {
      return this.items.reduce((sum, item) => sum + item.value, 0);
    }
  }
};
</script>
 

在Vue2中，若后端返回的数据结构为集合（数组），且集合中的对象包含数字字段，可以采用以下方法对特定字段进行求和。

使用计算属性（Computed Property）

计算属性是Vue中处理响应式数据逻辑的理想方式。通过遍历数组并对目标字段累加，可以动态计算总和。