el-table数据相同合并行

7 篇文章 0 订阅
// 合并行
objectSpanMethod({ row, column, rowIndex, columnIndex }) {
     let that = this
     that.spanArr = [] 
     that.pos = 0
     let data = this.topicTableData
   //遍历数据
     data.forEach((item, index) => {
         if (index === 0) { //判断是否是第一项(取决于你准备合并表格第几项)
             this.spanArr.push(1)
             this.spanSecondArr.push(1)
             this.pos = 0
         } else {//不是第一项时,就根据标识去存储
             if (data[index].func === data[index - 1].func) {// 查找到符合条件的数据时每次要把之前存储的数据+1
                 this.spanArr[this.pos] += 1
                 this.spanArr.push(0)
             } else {// 没有符合的数据时,要记住当前的index
                 this.spanArr.push(1)
                 this.spanSecondArr.push(1)
                 this.pos = index
             }
         }
     })
     if (columnIndex === 0) {
       // 页面列表上 表格合并行 -> 第几列(从0开始)
       // 需要合并多个单元格时 依次增加判断条件即可
       // 数组存储的数据 取出
         const _row = this.spanArr[rowIndex]
         const _col = _row > 0 ? 1 : 0
         return {
             rowspan: _row,
             colspan: _col
         }
     } else {//不可以return {rowspan:0, colspan: 0} 会造成数据不渲染, 也可以不写else,eslint过不了的话就返回false
         return false
     }
     
 },
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值