el-table使用fixed后，最后一行显示不全；el-table设置fixed后，最后一行被遮挡。

解决代码：

.el-table {/deep/ .el-table__body-wrapper {overflow-x: scroll !important;//直接设置横轴内容滚动条 即可撑高高度 还不影响使用}
}

一、情景：给element的el-table设置fixed固定后，最后一行显示部分被遮挡。有的说是有时出现这个问题。但是官方文档使用方法却没有出现。

二、原因： 这个bug现象只会在 使用fixed且没有滚动条的情况下才会出现，这也就解释了官方案例为啥正常了。

三、问题分析：
注意：解决方案3.1是如何找到问题和修改的，但是不推荐。 解决方案3.2更好更推荐使用。
原因：el-table下有个el-table_fixed盒子，就是el-table_fixed高度不够导致了遮挡。

解决方案3.1（不推荐做法）：
优点：显示正常
缺点：导致此固定列下方的滚动条被遮挡，导致无法点击滚动。
>

设置100%代码如下：

.el-table {/deep/ .el-table__fixed {height: 100% !important; //设置高优先，以覆盖内联样式  但是会遮挡滚动条}
}

解决方案3.2（推荐做法）：直接给表格内容 .el-table__body-wrapper 设置横向滚动条。
优点：直接就撑高了el-table_fixed的高度，显示正常，而且有滚动条时候也可以正常滚动。
缺点：内容足够时候也会有滚动条部分。但是这都是小的细节了对吧。。。可以忽略

下方是设置滚动条的代码↓↓↓↓↓↓↓↓↓↓↓↓↓

直接复制此一段代码即可。

.el-table {/deep/ .el-table__body-wrapper {overflow-x: scroll !important;//直接设置横轴内容滚动条 即可撑高高度 还不影响使用}
}

四、总结：
直接设置横向滚动条既可以！有效的话点个赞评论收藏一波，让更多朋友能看到吧！

el-table使用fixed后，最后一行显示不全；el-table设置fixed后，最后一行被遮挡。相关推荐

elementui table 表格固定列最后一行显示不全
elementui table 表格固定列最后一行显示不全这种情况有时在宽度刚好处于临界值状态时会出现.因为固定列是独立于表格body动态计算高度的,出现了固定列高度小于表格高度所以造成最后一行被遮 ...
winform打开cad图纸_CAD打开文件后发现图纸显示不全怎么办？
关注不迷路 1.每天持续更新CAD使用技巧和知识点! 2.想一起交流学习CAD的朋友们,可以加入 QQ群:421246724 3.学习资料和视频看群资料最近有很多同学都有找我问这么一个问题,就是 ...
解决CSDN博客文章保存网页到本地后，页面显示不全的问题
更新:2018.3.29 问题 CSDN博客文章设置为新版皮肤("大白"),保存网页到本地后.打开离线保存的网页,会出现页面显示不全的问题.(或者,点击"展开阅读全文&q ...
Android TextView多行最后一行显示不全
最近发现个奇怪的问题CheckBox与TextView一起放在一个横向LinearLayout中,当TextView文字内容超过一行时,最后一行文字显示不全,给控件加上背景之后,发现TextView与 ...
手机MTP模式连接电脑后文件夹显示不全小米5s
之前2s就有这毛病,一般重启,或者重命名文件就好了,到了5s尤其严重. (顺便吐槽一下,小米助手直到17-2-11,还不支持android 6) 我连接电脑后,只能显示部分文件.最新改动的,和之前的文 ...
QQ炫舞登录完后服务器没显示,qq炫舞进入界面后就没有了怎么回？
2013-11-17 qq炫舞安装完账号不能输入是怎么回事啊? 建议你关掉其他的所有程序,卸载原先炫舞,然后重新安装.下载炫舞后,里面会有一个类似"病毒"的程序会被杀毒软件给查找出 ...
Visio文件插入LaTeX/PDF另存为eps格式后导入LaTeX显示不全
方法一 Visio文件建议通过福晰阅读器打印生成PDF文件, 然后,利用Adobe 进行编辑,并另存为eps格式, 最后,插入LaTeX后显示是完全的,具体原因未知~ 但是这种方法visio图片会存在 ...
Visio画图打印为pdf另存为eps插入latex后，图片显示不全
目前发现两种解决方法. 1. 将vsdx文件另存为pdf,再将pdf另存为eps文件,运行latex后可以得到完整的图片,只是这样得到的eps文件偏大. 2. 将vsdx文件打印为pdf,打开pdf后 ...
解决在小程序/H5上点击输入框键盘弹起后弹框显示不全问题@令狐张豪
要实现的效果图: 解决思路: 先禁止input键盘弹起时,是否自动上推页面: 点击input的时候获取键盘弹起来的高度: 把获取出来的高度赋值到弹框的margin-bottom上: 键盘失焦或弹框关闭 ...

el-table使用fixed后，最后一行显示不全；el-table设置fixed后，最后一行被遮挡。

el-table使用fixed后，最后一行显示不全；el-table设置fixed后，最后一行被遮挡。相关推荐

最新文章

热门文章