当我们使用element table,有时我们需要部分的列固定,我们就给列添加了 fxied属性,但是这时候你会发现table的横向滚动条很难拖动,查找原因你会发现原来是固定的列把滚动条给挡住了,只有超出固定的部分滚动条才可以拖动。 解决办法 法一: 做法:修改el-table__fixed样式。 效果:就是设置bottom值,使得不盖住滚动条。
确认是否有全局或私有CSS样式修改了滚动条的默认行为。特别是检查是否有样式将滚动条隐藏或设置了极小的尺寸,导致滚动条不可见。你可以尝试重置或删除这些样式,看是否能解决问题。 检查列宽设置: 如果el-table或其列设置了固定宽度,且所有列的宽度之和未超过表格容器的宽度,那么横向滚动条可能不会出现。确保列宽之和...
1、访问localhost进入首页2、点击菜单进入订单页 localhost/order el-table横向滚动正常2、点击进入列表的详情页localhost/order/detail,手机左划返回上一页3、el-table横向滚动失效 失效后需要在浏览器上输入localhost并重新载入首页进入订单页才会恢复正常滚动,但进详情页回退后还是会失效 滚动永久生效 PS:更换360移动端...
问题分析:这是由于固定列遮挡了下方的滚动条,导致滚动条无法响应滚动操作。解决策略:通过调整固定列样式,给固定列添加下边距,设置的下边距大小等同于横向滚动条的高度。这样可以确保滚动条在固定列下方的区域依然可被激活。注意事项:此方法在屏幕分辨率足够大,无需横向滚动条时,会在固定列下方产生一道...
解决方法:改变固定列的样式,给固定列设置下边距,下边距的大小等于横向滚定条的高度 注意:这样改样式如果屏幕分辨率足够大无横向滚动条时,固定列下方就会多出一道横线,不美观,可以用样式去除 样式代码如下: //给固定列设置下边距.el-table{.el-table__fixed{height:auto!important;bottom:8px!important;//具体值是...
简介:解决el-table中横向滚动条无法显示的问题 前言 之前在做项目的时候,突然发现el-table在使用的过程中遇到了一些问题,在整常情况下如果列表元素过长那么就会显示一个横向的滚动条,但是我的滚动条莫名其妙的消失了,最后解决了,所以记录一些解决的方式。
原因:层级问题,左侧固定列层级高,滚动条层级低,提升一下滚动条层级即可 注意要在全局样式中定义类 fixed-scrool-error 样式 .fixed-scroll-error { .el-table--scrollable-x .el-table__body-wrapper { z-index: 2; } } 运用:直接在有问题的表格最外层 标签中使用 fixed-scroll-error 即可 ...
实现 无限滚动 之后,无法横向滚动原因已经知道了,是因为给 .el-table__body 设置了 position: absolute 导致的,但是如果不设置 定位 就无法实现虚拟滚动(按照个人目前的技术储备)。 部分代码:<el-table :data="visibleList" border stripe class="data-search-table" ...
工作中用到的el-table显示大批量数据的时候,一页放不下,一般性的处理方案是限定了高,让表格固定表头之后内部可以滚动,不过因为实际操作中样式的问题,需要我把整个表格高度全部显示出来,这样就造成了一个问题,就是横向滚动不方便 不过作为mac用户已开始没啥感觉,但是被用windows的同事吐槽了好久,于是终于决定花半天时...