【UI库组件】elementUI table合并列处理函数

elementUI中的合并列处理函数
做个笔记

处理函数

delArraySpanMethod(data){
    
    
//创建合并规则
this.spanZbArr= [];
this.spanZmArr = [];
//一个for循环就是一个合并的规则
  for (let i = 0; i < data.length; i++) {
    
    
    if (i === 0) {
    
    
      this.spanZbArr.push(1);
        this.index = 0;
    } else {
    
    
      //在if写你要合并的列的规则
      if (data[i].zbChannelName === data[i - 1].zbChannelName && data[i].engName === data[i - 1].engName) {
    
    
        this.spanZbArr[this.index] += 1;
        this.spanZbArr.push(0);
      } else {
    
    
        // 不相等push 1
       this.spanZbArr.push(1);
       this.index = i;
      }
    }
  }
  for (let i = 0; i < data.length; i++) {
    
    
    if (i === 0) {
    
    
      this.spanZmArr.push(1);
      this.index = 0;
    } else {
    
    
    //如果别的列跟上面的规则不同就多加一个
        if (data[i].engName === data[i - 1].engName) {
    
    
          this.spanZmArr[this.index] += 1;
          this.spanZmArr.push(0);
        } else {
    
    
          // 不相等push 1
          this.spanZmArr.push(1);
          this.index = i;
        }
    }
  }
}

table合并函数

// table合并行 row当前行  column当前列  rowIndex当前行号  columnIndex当前列号
    objectSpanMethod({
    
     row, column, rowIndex, columnIndex }) {
    
    
    // 指定行使用刚刚创建的合并规则
      if (columnIndex === 0 || columnIndex === 1 || columnIndex === 2 || columnIndex === 3 || columnIndex === 4 || columnIndex === 13) {
    
    
        for (let i = 0; i < this.spanZmArr.length; i++) {
    
    
          if (rowIndex === i) {
    
    
            return {
    
    
              rowspan: this.spanZmArr[i],
              colspan: 1
            };
          }
        }
      } else if (columnIndex === 5 || columnIndex === 6) {
    
    
        for (let i = 0; i < this.spanZbArr.length; i++) {
    
    
          if (rowIndex === i) {
    
    
            return {
    
    
              rowspan: this.spanZbArr[i],
              colspan: 1
            };
          }
        }
      }
    },