在使用fixed 固定列的时候随着滚动条向下滚动数据行和固定行出现了错位如下图所示影响美观解决方式如下图这个是我全局el-table的css配置重点是.el-table__fixed-body-wrapper { max-height: calc(630px - 120px); overflow-y: auto; }这一段我数据行定义的高度是(630px - 100px)固定列定义的是(630px - 120px后面又测试了一下-115px是完美的)这个结果是我试出来的可以根据自己的项目先确定好了数据行的高度在手动调整固定列的高度具体原因不太明白.el-table:not(.el-dialog .el-table) { max-height: 630px; .el-table__header-wrapper th, .el-table__fixed-header-wrapper th { word-break: break-word; background-color: #f8f8f9; color: #515a6e; padding: 4px 0; font-size: 12px; } .el-table__body-wrapper { max-height: calc(630px - 100px); overflow-y: auto; } .el-table__body td { padding: 4px 0; font-size: 12px; } .el-table__row { height: 32px; } .cell { line-height: 1.4; padding: 0 4px; } .el-table__fixed-body-wrapper { max-height: calc(630px - 120px); overflow-y: auto; } }---------------------------------------------2026/08/05补充---------------------------------------------------------------在后续开发的过程中发现用鼠标拖动滚动条时会产生只有右侧固定列滚动而中间的数据不动的现象但是使用鼠标滚轮滚动就没有产生这种现象很奇怪后面查了AI大概原因如下。Element UI 固定列的实现方式fixed 列不是钉住原表格的列而是复制一份只含固定列的表格作为遮罩层 .el-table__fixed-right 盖在主表格右侧其内部 .el-table__fixed-body-wrapper 本身可滚动。项目全局 CSS 制造了两个独立滚动区element-ui.scss给主表格 body-wrapper 和固定层 fixed-body-wrapper 各自设了 max-height overflow-y: auto。固定层又恰好盖住主表格的滚动条位置所以你拖动的那条滚动条实际属于固定层。Element UI 只有单向同步源码里只有主表格滚动 → 把 scrollTop 写回固定层没有反向逻辑。拖滚动条 浏览器原生行为只滚动拥有该滚动条的元素固定层→ 没有反向同步 → 左侧不动滚轮 滚主区域时触发正向同步滚固定层时 Element UI 有专门的 wheel 转发 → 一切正常。这就解释了滚轮好使、拖滚动条不灵的不对称现象。解决这个问题的方式是在全局的main.js中加入了如下的监听全局生效即使没有固定列的table也没有副作用对前端整体性能影响较小。document.addEventListener(scroll, (event) { const target event.target if (!target.classList || !(target.classList.contains(el-table__fixed-body-wrapper) || target.classList.contains(el-table__fixed-right-body-wrapper))) return const table target.closest(.el-table) const bodyWrapper table table.querySelector(.el-table__body-wrapper) if (bodyWrapper bodyWrapper.scrollTop ! target.scrollTop) { bodyWrapper.scrollTop target.scrollTop } }, true)---------------------------------------------2026/08/06补充---------------------------------------------------------------根本原因是不能使用CSS指定max-height由于项目需要全局使用将下面代码启动到main.js中原因如下纯 CSS 写 max-height 浏览器确实产生了滚动条 → 但组件的 watch 没触发 → layout.height 保持 null → updateScrollY 直接返回 false → scrollY 永远是 false → 表头不渲染 gutter 补偿列、右侧固定层 right: 0 压在滚动条上、列宽不扣滚动条宽度 → 固定列错位。传 max-height prop watch 触发 → layout.height 630 → updateScrollY 正常计算 → scrollY true → 全套补偿机制激活。一句话总结CSS 只能改变浏览器的渲染结果但组件的 JS 逻辑不会也无法自动去感知外部 CSS 造成了滚动条——它只认自己收到的 prop。这不是写法问题是 Element UI 2.x 的设计局限。Element.Table.props.maxHeight { type: [String, Number], default: 630 }它改的是组件的 props 默认值定义。每个 el-table 实例创建时Vue 会把没显式传值的 prop 用默认值 630 填充——相当于给所有表格全局传了 prop。这是唯一一个能全局生效、且组件内部逻辑能识别的入口。它和项目里已有的 Element.Dialog.props.closeOnClickModal.default false 是完全相同的官方套路不是 hack。