vue3中,el-table表格固定列后出现表格线段折断的问题

方式1:CSS 样式修复(最直接有效)-亲测有效

css 复制代码
/* 解决固定列与主体表格线条错位问题 */
.el-table__fixed,
.el-table__fixed-left,
.el-table__fixed-right {
  /* 核心:固定列高度减去滚动条高度(一般为 10px-17px) */
  height: calc(100% - 12px) !important;
}

.el-table__fixed-body-wrapper {
  height: 100% !important;
}

.el-table__fixed-body-wrapper .el-table__body {
  /* 为固定列内容区域添加底部内边距,模拟滚动条占位 */
  padding-bottom: 10px !important;
}

方式2:调用 doLayout 方法(动态修复)-亲测无效,可以试试

javascript 复制代码
// 假设你的 el-table 有 ref="tableRef"
this.$nextTick(() => {
  if (this.$refs.tableRef) {
    this.$refs.tableRef.doLayout()
  }
})
相关推荐
A黄俊辉A3 天前
uniapp webview中实现 app和内嵌的H5双向通信
vue.js·json
三十而立洋3 天前
Cookie 详解:从产生到安全,一次讲透
前端·javascript
卡布鲁3 天前
把一个 Vite + Vue3 应用塞进 qiankun (React + Umi3) 主站:十个坑的复盘
前端·javascript·react.js
李少兄3 天前
JavaScript 隐式全局变量解析
javascript
honkun63 天前
vue 表格组件 vxe-table 配置 ajax 请求自动加载数据与表单查询
vue.js·vxe-table
kybs19913 天前
全球灾害数据分析可视化 毕业设计-附源码66794
vue.js·spring boot·mysql·安全·django·c#·asp.net
雪芽蓝域zzs3 天前
第26章:ECharts 自定义主题 + 页面一键切换主题(深色 / 浅色两套)
vue.js·echars
雪芽蓝域zzs3 天前
第22章:ECharts 图表联动(多图表交互联动)
vue.js·echars
daols883 天前
vue 表格组件 vxe-table 实现虚拟滚动与无需滚动加载
vue.js·vxe-table
雪芽蓝域zzs3 天前
第18章:ECharts 折线图 + 标记点、标记线,自定义 tooltip
vue.js·echars