vue a-table表格重新渲染高度

最新推荐文章于 2024-04-26 17:54:13 发布

进击的小白兔vl

最新推荐文章于 2024-04-26 17:54:13 发布

阅读量1k

点赞数

文章标签： vue.js javascript ecmascript

本文链接：https://blog.csdn.net/m0_46404694/article/details/130684889

版权

a-table在切换过程中，如果出现固定列，单元格合并等情况，可能会出现表格错位等情况

解决方案：重新渲染表格

  tableResize() {
      this.$nextTick(function () {
        var doc = document.getElementsByClassName("ant-table-fixed-left");
        if (doc.length > 0) {
          for (let i = 0; i < doc.length; i++) {
            var child = doc[i].getElementsByClassName("ant-table-thead");
            var tr = child[0].getElementsByTagName("tr")[0];
            if ("" == tr.style.height) {
              // console.log(tr.style.height);
              //高度为空，则设置高度
              // console.log(i);
              var th = tr.getElementsByTagName("th")[0];
              var rowspan = th.getAttribute("rowspan");
              tr.style.height = rowspan * 23 + "px";
            }
          }
        }
      });
    },```