is me. 2021-08-02 14:37 采纳率: 87.5%
浏览 341
已结题

el-table 表头单元格合并问题

用el-table做了两个表格在同一个页面,都需要合并表头单元格,第一个用colspan的方法合并成功了,第二个不行,就改用了header-cell-style方法,还是不行,没有办法实现合并,又试了一下用span-method 但是不知道为什么,这个没办法识别到表头行!想问一下大家有没有什么其他办法,能够做到合并表头单元格!
这是第一个实现的效果:

img

实现第一个用到的代码:

 setColSpan:function() {
        // 获取表头的所有单元格
        var x = document.getElementsByClassName("el-table__header")[0].rows[0].cells
        // 将第三列表头单元格的colSpan设为2
        x[2].colSpan = 2
        // 将第四列表头单元格的display设为none
        x[3].style.display = 'none'
      }

第二个就无法合并:

img

第二个表格用到的代码:

  colMethod({ row, column, rowIndex, columnIndex }){
        if (rowIndex ===0 || rowIndex === 1){
          if (rowIndex === 0) {
                  if (columnIndex === 2) {
                    return {
                      Rowspan: 1,
                      Colspan: 2,
                      backgroundColor:'#B3D8FF',color:'#333333'
                    }
                  }else if(columnIndex === 3){
                    return {}
                  }
                }
          return {backgroundColor:'#B3D8FF',color:'#333333'}
        }
    }

有没有哪位朋友知道问题出在哪里啊?

  • 写回答

1条回答 默认 最新

  • weixin_38376461 2021-08-02 15:13
    关注

    啥意思,没有理解具体需求

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

问题事件

  • 系统已结题 10月17日
  • 已采纳回答 10月9日
  • 创建了问题 8月2日