el-table-column width="180" 宽度自动成比例缩放缩小 表头宽度不对 原因

发布时间 2023-12-06 15:58:44作者: hrdom

首先el-table-column width="180"的设置原理是 如下面加粗部分

 

<table cellspacing="0" cellpadding="0" border="0" class="el-table__header" style="width: 1638px;">

<colgroup><col name="el-table_12_column_97" width="180"><col name="el-table_12_column_98" width="120"><col name="el-table_12_column_99" width="120"></colgroup>

</table>

 

至于为什么表头的列宽会成比例缩小

原因是<table>的style width设成了auto !important,覆盖了style="width: 1638px;"

 

此外,关于列宽的拖动修改 border

实现更新宽度 style="width: 1638px;" 的地方是

      doLayout() {
        if (this.shouldUpdateHeight) {
          this.layout.updateElsHeight();
        }
        this.layout.updateColumnsWidth();
      },