一般情况下，遇到表头错位，只需要采用以下方法解决就行了：

watch: {
    // tableData是el-table绑定的数据
      tableData: {
        handler() {
          this.$nextTick(() => {
            // tableRef是el-table绑定的ref属性值
            this.$refs.tableRef.doLayout()
          })
        },
        deep: true,
      }
  }
<style lang="scss" scoped>
  /deep/ .el-table th.gutter {
    width: 0px !important;
    display: table-cell !important;
  }
</style>

至于，为什么要使用nextTick，是因为watch会在updated生命周期函数之前执行，也就意味着数据还未更新，这时候对 Table 进行重新布局,计算会不准确。

今天开发的时候，遇到测试提的一个很奇葩的关于el-table的缺陷，当我们对屏幕进行了放大之后，原本没问题的el-table会出现表头错位，也是这样解决的。

1637228111(1).png

如有错误，欢迎指正！