el-table合并单元行

<el-table
  size="small"
  :data="mt_data"
  stripe :fit="true"
  border style="width: 100%;text-align: center;  position: absolute !important;
    overflow: auto !important; bottom: 60px; top: 110px;"
  :span-method="arraySpanMethod"
  element-loading-text="拼命加载中">
<el-table-column align="center"  prop="PROJECT_NAME" sortable label="名字"> </el-table-column>

<el-table>

export default {

  data() {
    return { 
    needMergeArr:['PROJECT_NAME'],
     rowMergeArr:{},
    }
methods: {
getApiData(){
     getData().then(res=>{
    let datas=res.data
      this.rowMergeArr = this.rowMegeHandle(this.needMergeArr,datas)
       })
     }

arraySpanMethod({row,column,rowIndex,columnIndex}){
  if(column.property ==='PROJECT_NAME'){
    return this.mergeAction('PROJECT_NAME',rowIndex, column)
  }
},
mergeAction(val,rowIndex,colData){
  let _row = this.rowMergeArr[val].rowArr[rowIndex]
  let _col = _row>0?1:0
  return[_row,_col]
},
rowMegeHandle(arr,data){
  if(!Array.isArray(arr)&&!arr.length) return false;
  if(!Array.isArray(data)&&!data.length) return false;
  let needMerge = {};
  arr.forEach(i =>{
    needMerge[i] = {
      rowArr:[],
      rowMergeNUm:0
    };
    data.forEach((item,index) =>{
      if(index === 0 ){
        needMerge[i].rowArr.push(1);
        needMerge[i].rowMergeNum = 0;
      }else{
        if(item[i]===data[index-1][i]){
          needMerge[i].rowArr[needMerge[i].rowMergeNUm] += 1
          needMerge[i].rowArr.push(0)
        }else{
          needMerge[i].rowArr.push(1)
          needMerge[i].rowMergeNUm = index
        }
      }
    })
  })
  return needMerge
}
}
}
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值