Solve the problem that the Ant Design Vue table component fixed a certain column (fixed) and expanded a certain row (expandedRowRender) cannot be used at the same time, resulting in misalignment

Solve the problem that the Ant Design Vue table component fixed a certain column (fixed) and expanded a certain row (expandedRowRender) cannot be used at the same time, resulting in misalignment

method:

//  解决Ant Design Vue table组件固定某列(fixed)和展开某行(expandedRowRender)不能同时使用 出现错位的问题
    render() {
    
    
      this.$nextTick(() => {
    
    
        setTimeout(() => {
    
    
            let element = document.querySelectorAll(".ant-table-expanded-row");
            let len = element.length / 2;
            for (let i = 0; i < len; i++) {
    
    
              element[i + len].style.height = element[i].offsetHeight + "px";
            }
        }, 100)
      })
    },

Multi-position call recalculation
1, expansion, selection, initialization, etc. are called to recalculate the height. Pro test is effective

Guess you like

Origin blog.csdn.net/weixin_44461275/article/details/129121220