使用el-table表格组件的时候固定列导致塌陷的问题

777 阅读1分钟
    在使用elementui框架的时候,使用table组件,当需求要求固定前面几列或者后面几列
    的时候,此时你切换tab展示不同的表格,或者用v-if控制切换不同的表格,数据发生了改
    变并且表头也发生了改变,会出现塌陷问题,此时你加上了自带的doLayout方法之后,出
    现有个闪屏的现象,体验感很不好,虽然重绘帮你解决了塌陷,但是体验感很不好,这是
    由于ele固定列的时候,你的表格单元格的高度是动态计算的,帮你重绘之后,页面重新
    计算了一波单元格的高度导致了闪屏的问题,此时我们可以将单元格高度写死即可解决
    如下:
        在beforeUpdate里面写:
        this.$nextTick(() => {
            this.$refs.table.doLayout()
        }),
        在样式文件里面直接样式覆盖:
        ::v-deep .el-table .cell {
            height: xxxpx!important;
            line-height:xxxpx!important;
        }
    如果你想动态计算表格的高度依然适用。