el-table设置了固定列 滚动条无法拖动问题

最新推荐文章于 2025-09-24 13:22:42 发布
原创 最新推荐文章于 2025-09-24 13:22:42 发布 · 2k 阅读 · 1 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文介绍了一种精简CSS样式的技巧，特别针对.el-table__fixed和.el-table__fixed-right类，通过设置高度为auto和调整底部偏移量，实现更灵活的表格布局。

.el-table__fixed {
height: auto !important;
bottom: 18px;
}
.el-table__fixed-right {
height: auto !important;
bottom: 18px;
}

Vue2 - 解决 iView 表格组件 Table 滚动条无法拖动问题，表格固定列时滚动条失效导致拖拽没反应，把表格的某列固定后横向或纵向滚动条无法滚动的问题处理（有合计行或固定时导致失效无法拖曳）
🏆 前端领域优质创作者
07-14 3462
iview，vue，表格组件，table，滚动条，无法拖曳，拖动，无效，不生效，没反应，table固定列后,进度条无法拖拽iview固定列导致滚动条失效，也不报错，样式，无法覆盖，deep，iviewtable组件当固定高度后，fixed某一列会出现盖住滚动条的情况，滚动条始终位于可视区域的实现，详细解决方案，如何解决这个问题，样式覆盖依然报错，无法滚动，鼠标拖住不动，设置固定列，横向滚动条在固定列的位置上无法滚动的问题，vue2iview表格固定后滚动条无法拖动，解决iview带合计行表格固定列后滚动
ElementUI＜el-table＞＜/el-table＞表格中固定列横向滚动条无法拖动解决
qq_53911056的博客
10-31 3121
当表格有固定列会出现横向滚动条无法拖动问题，尤其是固定列固定在左边且表格没数据的时候。这可能是因为固定区域盖住了横向滚动条，不是视觉上的覆盖，是去拖动时没有触发效果。
el-table锁定列后部分位置横向滚动条无法拖动问题
kelongren99的博客
08-22 270
修改el-table__body-wrapper样式的层级。
Element UI表格固定列：Table固定列滚动方案
最新发布
gitblog_01192的博客
09-24 630
在企业级Web应用开发中，表格（Table）组件作为数据展示的核心载体，经常面临数据量大、列数繁多的场景。当用户横向滚动表格查看数据时，关键列（如ID、操作按钮）的易读性和可访问性会显著下降。Element UI作为基于Vue.js 2.0的UI组件库，提供了灵活的表格固定列功能，支持左侧固定、右侧固定及多列固定场景。本文将从实现原理、使用指南、性能优化三个维度，深入解析Element UI表格固...
日常开发记录-el-table 固定列下横向滚动条无法拖动的问题解决方案
machine_vision123的博客
08-25 1652
原因：层级问题，左侧固定列层级高，滚动条层级低，提升一下滚动条层级即可 注意要在全局样式中定义类 fixed-scrool-error样式 .fixed-scroll-error { .el-table--scrollable-x .el-table__body-wrapper { z-index: 2; } } 运用：直接在有问题的表格最外层 标签中使用 fixed-s...
处理前端Table组件中的滑动条失灵问题
weixin_68434215的博客
03-07 310
由上面的表现联想到：可能是Table表的高度设置的不当，导致冻结的区域延伸到了表格对应列的下方，导致滑动条无法进行拖动。通过修改Table中:height的高度，重新设定一个人合适的值——>Bug修复，Table表中有冻结的列，当滑动条在这些列下面时，鼠标无法选中滑动。今天碰到一个低级但是很有意思的小Bug拿出来分享一下。但在其他未冻结列的下面都可以正常使用，来回滑动。
element-ui的table组件，给某些列设置了fixed属性后，滚动条无法拖动
weixin_37739550的博客
07-20 2399
问题描述 在使用ele-ui的table组件时，给前四列设置了fixed属性，让前四列可以固定，不随着滚动条滚动移动，结果发现设置后，拖动横向的滚动条的前半部分无法拖动。 后来发现原因是设置了fixed属性的列把滚动条覆盖了，一般是看不到，但是把页面缩小就发现了，如下图： 解决方法： .el-table__fixed { height:auto !important; // 让固定列的高自适应，且设置!important覆盖ele-ui的默认样式 bottom:17px; // 固定列默认设置了
element的el-table中记录滚动条位置的示例代码
10-16
为了解决这个问题，示例中展示了一种可能的解决方案：在`pageChange`方法中，设置滚动条位置时，使用`setTimeout`来确保滚动条位置的正确设置。 具体操作为，在页面变化（pageChange）时，除了触发分页事件外，还会...
[IE兼容] el-table组件固定列触发滑轮滚动时，移动速度缓慢
weixin_45776447的博客
05-13 1507
[IE兼容] el-table组件固定列触发滑轮滚动时，移动速度缓慢 问题描述： ie浏览器下，element table组件固定列如果触发鼠标滑动事件时，整体页面滚动速度大幅度降低 chrome浏览器下，速度仅仅是小幅度降低 原因： tab组件默认调慢了固定列滑轮滚动的效果 解决方法： 禁用固定列整体的监听事件 .el-table__fixed{ pointer-events: none } 或者禁用多数列并针对个别列接触禁用， .el-table__fixed{ .el-table_
el-table如何设置出现滚动条
01-24
### element UI el-table 组件中设置滚动条的方法 对于 `el-table` 组件中的滚动条设置，可以通过CSS自定义样式来实现特定的需求。当需要去除滚动条并隐藏其占据的空间时，可以采用如下方式： 为了移除滚动条及其...
关于el-table添加fixed或fixed=“right“无横向滚动条的解决方法
Callme_FanXu的博客
11-07 2219
需要加上浏览器兼容写法webkit，当然也可以对滚动条的样式加以修改，让你的滚动条样式更加美观！
解决el-table设置了fixed固定列导致的滚动条无法拖动问题
负数
11-11 3246
el-table中的el-table-column提供了一个fixed属性设置固定列，但是设置了之后发现表格的滚动条无法拖动了，通过F12定位到页面元素发现是滚动条被固定列生成的元素给覆盖了，于是想办法通过修改样式的方式解决问题 <style lang="scss" scoped> .el-table { .el-table__fixed { // 左固定列 height: auto !important; bottom: 18px; // 改为自动高度后.
css篇- el-table设置列固定fixed后，滚动条无法拖动
qq_42440919的博客
12-21 3777
el-table设置列固定，使用fixed 但是使用fixed后导致fixed列下面的滚动条无法拖动，因为列固定列覆盖了滚动条，导致无效 解决办法：设置el-table-fixed的height为auto ！important。但是测试后这部分css一直不生效，后来加上/deep/ 生效。 ...
element-ui table表格 增加合计行 和 表格列固定之后 滚动条无法滚动
weixin_筱玉的博客
08-17 2804
滚动条无法滚动 自定义合计行
el-table设置列fixed时X轴滚动条无法拖动问题
qq_44741577的博客
02-24 1145
属性，让列可以固定，不随着滚动条滚动移动，结果发现设置后，拖动横向的滚动条的前半部分无法拖动。后来发现原因是设置了。组件时，给表格的某些列设置了。属性用来控制一个元素。
【ElementUI】table标签下的el-table-column内容无法显示
jinliping334的博客
12-13 5372
【ElementUI】table标签下的el-table-column内容无法显示出现的问题解决方法 出现的问题 代码 <el-table-column fixed="right" label="操作" width="100"> <template slot-scope="scope"> <el-button @click="handleClick(scope.row)" type="text" size
element 表格 使用fixed无效
weixin_49261425的博客
07-02 4290
/*设置overflow*/ /deep/ .el-table__body-wrapper{ overflow: auto; } /*表头和内容给一个固定宽度*/ /deep/ .el-table__header{ width: 1918px !important; } /deep/ .el-table__body{ width:1900px !important; } /deep/ .el-table__footer{ width: 1918px !important; } 如何有滚动.
【VUE+ElementUI】el-table表格固定列el-table__fixed导致滚动条无法拖动
sunshineTing2的博客
04-03 2590
当设置了几个固定列之后，点击左侧滚动条却被遮挡
解决elementui table固定列的时候，滚动条被遮挡无法拖动的问题
m0_53323595的博客
03-24 459
解决elementui table固定列的时候，滚动条被遮挡无法拖动的问题
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值