el-table动态合并单元格

el-table使用这个方法合并单元格，:span-method=“hbcell”

<el-table size="small" :data="table.data" border empty-text="暂无数据" :cell-style="cellStyle" :header-cell-style="tableHeaderColor":span-method="hbcell"><el-table-column align="center" v-for="item in table.columns" :key="item.prop" :prop="item.prop":label="item.label"></el-table-column></el-table>

//合并单元格hbcell({row,column,rowIndex,columnIndex}){if (columnIndex === 0) {//只需要合并第一列return this.mergeCol(rowIndex,this.table.columns[columnIndex].prop)}}//处理合并单元格mergeCol(rowIndex,prop){//获取当前单元格的值let colVal = this.table.data[rowIndex][prop]; //循环每一列的数据if(rowIndex>0){if(this.table.data[rowIndex][prop]!=this.table.data[rowIndex-1][prop]){let i=rowIndex;let num=0;while(i<this.table.data.length){if(this.table.data[i][prop]===colVal){//相等进行计数i++;num++;}else{//跳出循环break;}}return {rowspan:num,colspan:1};}else{//相等则不显示return {rowspan: 0,colspan: 0};}}else{//如果为第一行let i=rowIndex;let num=0;while(i<this.table.data.length){if(this.table.data[i][prop]===colVal){//相等进行计数i++;num++;}else{//跳出循环break;}}return {rowspan:num,colspan:1};}},