【问题标题】：Laravel vue SUM array data inside arrayLaravel vue SUM 数组内的数组数据
【发布时间】：2020-07-27 22:27:51
【问题描述】：

我有一个数据数组，其中包含数组，在第二个数组中我需要对一列求和并返回结果。

截图

代码

controller

public function index()
{
  $zones = ZoneRegion::orderby('id', 'desc')->with(['areas', 'segments', 'links', 'cabels'])->get();
  return response()->json([
    'data' => $zones,
    'message' => 'Zona Wilayah berhasil diambil.'
  ]);
}

component

data() {
    return {
        regions: [],
    }
},
methods: {
    fetchRegions() {
        axios
        .get('/api/admin/zones', {
            headers: {
                Authorization: 'Bearer ' + localStorage.getItem('access_token')
            }
        })
        .then(response => {
            this.regions = response.data.data;
        })
        .catch(function (error) {
            console.log('error', error);
        });
    },
}

有什么建议吗？

【问题讨论】：

我发布了一个答案，但现在我相信您只想对数据数组中每一行的电缆长度求和？还是您想要所有行的总长度？
让我知道您需要什么，以便我更新我的答案，无论哪种方式都应使用 reduce 方法。
@RobertKujawa 谢谢，是的，我只需要每一行的总和。我会试试你的代码并告诉你

标签： arrays laravel vue.js vuejs2

【解决方案1】：

您可以使用js reduce method 将所有电缆长度相加。

data() {
    return {
        regions: []
    }
},
methods: {
    fetchRegions() {
        axios
        .get('/api/admin/zones', {
            headers: {
                Authorization: 'Bearer ' + localStorage.getItem('access_token')
            }
        })
        .then(response => {
            this.regions = response.data.data.map(region => ({
                ...region,
                totalCableLength: region.links.reduce((total, link) => {
                    return total + parseInt(link.cable_length);
                }, 0)
            }));
        })
        .catch(function (error) {
            console.log('error', error);
        });
    }
}

这将保存您的区域，就像您从服务器检索它们一样，但它会将所有链接电缆长度的总和添加到每个区域，它将由“totalCableLength”键控。

【讨论】：

嗨，我已经在组件中尝试过你的代码，它确实返回了结果，但是因为我需要在我的表中使用它，所以它什么也没显示（你知道表是循环的，所以我认为这是 getCableLength(data)也许应该以某种方式推送到this.regions？）
我认为您的代码一次对所有值求和，我正在寻找的是基于行的，所以可以说（第 1 行 = 1000 和第 2 行 = 1500），但我现在得到的是总计 2500
我更新了我的答案，因此您只需遍历您的区域数组并访问 region.totalCableLength 即可检索您的总数。
对不起，我的错，删除分号。我再次更新我的答案。
在;之前应该是}, 0) }));少1个)