el-table实现总计(后台返回两个数组)

问题遇到的现象和发生背景

问题描述:用el-table做一个表格,后台返回的两个数组,一个表格数据数组,一个总计数组,需要将总计渲染在表格第一行。

我的解答思路和尝试过的方法

我使用了vuex,在vuex中我将两个数组concat,将合并后返回的新数组绑定表格。可以实现。但是存在两个问题:1.每次加载页面数据控制台会报错(图一)。2。这样渲染的表格第一行不能固定不动,会随滚动条滚动。

运行结果及报错内容

报错:Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'concat')

我想要达到的结果

有没有哪位大@有好办法 可以实现表格总计,因为有很多百分数,所以也不便直接计算,最好是直接使用后台返回的总计。在此感谢

你这个报错 说明 你调用 concat的对象 没有concat的方法 。也就是说 它存在 不是一个数组 的情况 。

比如 a.concat(b) .a可能存在 不是 数组的情况 ,你可以 打印一下 。看看 。

做个判断 试试
if(a&&a.length>0){
a.concat(b)
}

表格数组和总计数组内容是对应的吧,写了个列子你看看能参考不:

      let arr1 = [
        {
          id: '1',
          name: '3',
        },
        {
          id: '4',
          name: '4',
        },
        {
          id: '5',
          name: '5',
        },
      ];
      let arr2 = [
        {
          value: 12,
        },
        {
          value: 13,
        },
        {
          value: 14,
        },
      ];
      arr1.forEach((item, index) => {
        Object.assign(item, arr2[index]);
      });
      console.log(arr1);

img