element表格列单元格相同合并

html代码:

//`template上`
        <el-table 
            :data="tableData" 
            border
            ref="filterTable"
            :span-method="chengeShowMethod"
          >
          <!-- 表头  +  表中的数据-->
            <el-table-column type="index" label="序号" style="min- 80px"></el-table-column>
            <el-table-column
              v-for="(e, i) in columns"
              :key="i"
              show-overflow-tooltip
              header-align="center"
              :prop="e.fieldCode"
              :label="e.fieldName"
              :formatter="formatter"
            >
            </el-table-column>
          </el-table>
//js代码
// 改变第一列的数据
    chengeShowMethod({ row, column, rowIndex, columnIndex }){
        if (columnIndex === 1) {
          // console.log(this.flitterData(this.tableData))
          const _row = (this.flitterData(this.tableData).two)[rowIndex];
          const _col = _row > 0 ? 1 : 0;
          return {
            rowspan: _row,
            colspan: _col
          };
        }
    },

// 获取合并的数组
flitterData(arr) {
let spanOneArr = []
let spanTwoArr = []
let concatOne = 0
let concatTwo = 0
arr.forEach((item, index) => {
console.log(item, index)
if (index === 0) {
spanOneArr.push(1);
spanTwoArr.push(1);
} else {
if (item.billno === arr[index - 1].billno) { //第一列需合并相同内容的判断条件
spanOneArr[concatOne] += 1;
spanOneArr.push(0);
} else {
spanOneArr.push(1);
concatOne = index;
};
if (item.code === arr[index - 1].code && item.billno === arr[index - 1].billno) {//第二列需合并相同内容的判断条件
spanTwoArr[concatTwo] += 1;
spanTwoArr.push(0);
} else {
spanTwoArr.push(1);
concatTwo = index;
};
}
});
return {
one: spanOneArr,
two: spanTwoArr,
}
},