element.ui合併單元格

循壞遍歷出的表格

getSpanArr(data, index) {
  for (var i = 0; i < data.length; i++) {
    if (i === 0) {
      this.spanArr[index].push(1);
      this.pos[index] = 0
    } else {
      // 判斷當前元素與上一個元素是否相同,因合併第一個因此[0]
      if (data[i].lvSuppGoodsId === data[i - 1].lvSuppGoodsId) {
        this.spanArr[index][this.pos[index]] += 1;
        this.spanArr[index].push(0);
      } else {
        this.spanArr[index].push(1);
        this.pos[index] = i;
      }
    }
  }
},

objectSpanMethod({ row, column, rowIndex, columnIndex },index) {
  if (columnIndex <= 7 ) {
    const _row = this.spanArr[index][rowIndex];
    const _col = _row > 0 ? 1 : 0;
    return {
      rowspan: _row,
      colspan: _col
    }
  }
},

在數據請求時調用getSpanArr()

<el-table :data="item.children" border style="width: 100%" max-height="500" :span-method="a => {return  objectSpanMethod(a,index)}">

利用閉包傳自定義參數


效果圖：