項目需求:第二列的內容如果相同,則合并單元格,并且序號也合并:

?實現方法:

1.rowspan()方法在獲取數據之后調用

rowspan() {this.spanArr = [];//在data里面定義 this.position = 0; //在data里面定義this.tableData1.forEach((item,index) => {if( index === 0){this.spanArr.push(1);this.position = 0;item.sequence=index+1;//設置序號}else{if(this.tableData1[index].projectName === this.tableData1[index-1].projectName ){this.spanArr[this.position] += 1;//連續有幾行項目名名稱相同this.spanArr.push(0); // 名稱相同后往數組里面加一項0console.log(this.spanArr)//當項目名稱相同時，設置當前序號和前一個相同this.tableData1[index].sequence = this.tableData1[index-1].sequence;}else{this.spanArr.push(1);this.position = index;//當項目名稱不同時，將當前序號設置為前一個序號+1this.tableData1[index].sequence = this.tableData1[index-1].sequence+1;}}})},objectSpanMethod({ row, column, rowIndex, columnIndex }) { //表格合并行if(columnIndex === 0){ //序號列也進行合并(第一列)//this.spanArr這個數組里面存的是table里面連續的有幾條數據相同//例如:[1,1,2,0,2,0]//1 代表的沒有連續的相同的//2 代表連續的兩個相同//0 代表是和上一條內容相同const _row = this.spanArr[rowIndex];const _col = _row>0 ? 1 : 0;console.log("ppp")console.log(_row)console.log(_col)return {rowspan: _row, //行colspan: _col //列 }}if(columnIndex === 1){ //項目列也進行合并(第二列)const _row = this.spanArr[rowIndex];const _col = _row>0 ? 1 : 0;return {rowspan: _row,colspan: _col}}},

?

轉載于:https://www.cnblogs.com/xieli26/p/10161843.html

總結

以上是生活随笔為你收集整理的element-ui table表格内容相同自动合并的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。