elementplus vue3 table表格动态合并单元格

let cellList: any[] = [] // 单元格数组
let count: number = 0 // 计数

const computeCell = (tableList: any[], name) => {
  cellList = []
  count = 0
  for (let i = 0; i < tableList.length; i++) {
    if (i === 0) {
      // 先设置第一项
      cellList.push(1); // 初为1，若下一项和此项相同，就往cellList数组中追加0
      count = 0; // 初始计数为0
    } else {
      if (tableList[i][name] == tableList[i - 1][name]) {
        cellList[count] += 1; // 增加计数
        cellList.push(0); // 相等就往cellList数组中追加0
      } else {
        cellList.push(1); // 不等就往cellList数组中追加1
        count = i; // 将索引赋值为计数
      }
    }
  }
}
const objectSpanMethod = ({ rowIndex, columnIndex }) => {
  // 排科室
  if (columnIndex === 1) {
    computeCell(tableDatas.value, 'name')
    const fRow = cellList[rowIndex]
    const fCol = fRow > 0 ? 1 : 0
    return {
      rowspan: fRow, // 合并的行数
      colspan: fCol // 合并的列数，为0表示不显示
    }
  }

  // 排工序
  if (columnIndex === 2) {
    computeCell(tableDatas.value, 'gx')
    const fRow = cellList[rowIndex]
    const fCol = fRow > 0 ? 1 : 0
    return {
      rowspan: fRow, // 合并的行数
      colspan: fCol // 合并的列数，为0表示不显示
    }
  }
}

 

然后再table加上 :span-method="objectSpanMethod"