日韩性视频-久久久蜜桃-www中文字幕-在线中文字幕av-亚洲欧美一区二区三区四区-撸久久-香蕉视频一区-久久无码精品丰满人妻-国产高潮av-激情福利社-日韩av网址大全-国产精品久久999-日本五十路在线-性欧美在线-久久99精品波多结衣一区-男女午夜免费视频-黑人极品ⅴideos精品欧美棵-人人妻人人澡人人爽精品欧美一区-日韩一区在线看-欧美a级在线免费观看

歡迎訪問 生活随笔!

生活随笔

當前位置: 首頁 > 编程资源 > 编程问答 >内容正文

编程问答

element-ui table表格内容相同自动合并

發布時間:2025/3/15 编程问答 24 豆豆
生活随笔 收集整理的這篇文章主要介紹了 element-ui table表格内容相同自动合并 小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

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

?實現方法:

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表格内容相同自动合并的全部內容,希望文章能夠幫你解決所遇到的問題。

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