el-table使用fixed后,最后一行显示不全;el-table设置fixed后,最后一行被遮挡。
解決代碼:
.el-table {/deep/ .el-table__body-wrapper {overflow-x: scroll !important;//直接設(shè)置橫軸內(nèi)容滾動條 即可撐高高度 還不影響使用} }一、情景:給element的el-table設(shè)置fixed固定后,最后一行顯示部分被遮擋。有的說是有時出現(xiàn)這個問題。但是官方文檔使用方法卻沒有出現(xiàn)。
二、原因: 這個bug現(xiàn)象只會在 使用fixed且沒有滾動條的情況下才會出現(xiàn),這也就解釋了官方案例為啥正常了。
三、問題分析:
注意:解決方案3.1是如何找到問題和修改的,但是不推薦。 解決方案3.2更好更推薦使用。
原因:el-table下有個el-table_fixed盒子,就是el-table_fixed高度不夠?qū)е铝苏趽酢?/strong>
解決方案3.1(不推薦做法):
優(yōu)點:顯示正常
缺點:導(dǎo)致此固定列下方的滾動條被遮擋,導(dǎo)致無法點擊滾動。
>
設(shè)置100%代碼如下:
解決方案3.2(推薦做法):直接給表格內(nèi)容 .el-table__body-wrapper 設(shè)置橫向滾動條。
優(yōu)點:直接就撐高了el-table_fixed的高度,顯示正常,而且有滾動條時候也可以正常滾動。
缺點:內(nèi)容足夠時候也會有滾動條部分。但是這都是小的細節(jié)了對吧。。。可以忽略
下方是設(shè)置滾動條的代碼↓↓↓↓↓↓↓↓↓↓↓↓↓
直接復(fù)制此一段代碼即可。
.el-table {/deep/ .el-table__body-wrapper {overflow-x: scroll !important;//直接設(shè)置橫軸內(nèi)容滾動條 即可撐高高度 還不影響使用} }四、總結(jié):
直接設(shè)置橫向滾動條既可以!有效的話點個贊評論收藏一波,讓更多朋友能看到吧!
總結(jié)
以上是生活随笔為你收集整理的el-table使用fixed后,最后一行显示不全;el-table设置fixed后,最后一行被遮挡。的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: DVbbs8.2入侵思路与总结
- 下一篇: 给窗口设置系统级或窗口级的热键