1、返回数据为一维数组

?
1
2
3
getData() {
 that.tableData = res.data.data.list;
}

2、合并函数

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
挂在vue底层：
Vue.prototype.$spanMethodFunc=function(list, props, row, col)
写在method内：
spanMethodFunc(list, props, row, col) {
      if (col >= props.length || !props[col]) {
        // console.log(123)
        // 根据传入的字段列表,判断不需要合并的列
        return [1, 1];
      } else {
        //使用try-catch,如果方法错误返回错误信息
        try {
          let _props = props.slice(0, col + 1); //截取需要用到判断的字段名
          // 判断是否从本行开始合并
          let merge = _props.some(item => {
            // console.log(list[row])
 
            // 如果当前行所需要判断合并的字段中有一个跟前一条数据不一样,本条数据即为合并的起点,第一条数据直接为合并起点
            return row == 0 || (item && list[row][item] != list[row - 1][item]);
          });
          // 如果本条数据是合并起点,获取需要合并的数据条数
          // console.log(merge)
          if (merge) {
            let _list = list.slice(row); //截取从本条数据开始的列表
            // 获取合并行数
            let _lineNum = _list.findIndex((item, ind) => {
              //同merge判断,找到合并的终点
              return (
                ind &&
                _props.some(item1 => {
                  return item1 && item[item1] != _list[0][item1];
                })
              );
            });
            // 合并行数为-1时,输出_list的长度,否则输出_lineNum
            return [_lineNum === -1 ? _list.length : _lineNum, 1];
          } else {
            // 否则,返回[0,0],即本条数据被合并
            return [0, 0];
          }
        } catch (err) {
          // 打印报错
          console.error("spanMethodFunc error:", err);
        }
      }
    },

　　3、调用合并

?
1
2
3
4
5
6
7
8
9
10
11
12
13
objectSpanMethod({ row, column, rowIndex, columnIndex }) {
     let propSpan = [
       "id",
       "company",
       "contractId"
     ];<br>//<em>例如:[“id”,“”“contractId”]</em>
     return this.spanMethodFunc(
       this.tableData,
       propSpan,
       rowIndex,
       columnIndex
     );
   },