2023年6月20日发(作者：)
ElementUITable组件固定列及滚动条样式异常序⾔ 在使⽤Elemet UI时，常⽤的el-table组件的固定列显⽰不正常：a.固定列最后⼀⾏显⽰不正常，最后⼀⾏横向只显⽰⼀部分。b.⽤横向滚动条滚动表格时，固定列跟着⼀起滚动。解决⽅法a.解决问题a时百度挺管⽤，很多⼈都遇到这个问题，于是按照别⼈的答案，修改固定列的⾼度。.el-table__fixed{ height:100% !important;}.el-table__fixed-right{ height:100% !important;}加上之后就解决了，固定列最后⼀⾏显⽰不完整的问题；b. 解决b问题时，百度后发现居然没有⼈遇到我这种问题； 1.将⾃⼰定义的所有样式全都去除，只留固定列的设置，仍然显⽰不正常。 2.浏览器调试模式观察⽣成的html代码中样式和官⽹对⽐，仍然找不到问题所在（但是应该是有差别的，我当时没有找到） 3.请教了好⼏位同事，在和其中⼀位同事重现我的问题时，⽤他的页⾯中的el-table组件进⾏重现。第⼀次打开⽤他的页⾯，滚动条能正常显⽰并且滚动。接下来看我的页⾯却不⾏，奇怪的是，切回去看他的页⾯显⽰也不正常了。于是他猜想是样式污染导致的。果不其然，全局搜索发现，在其他的vue组件中有如下样式。 .el-table--scrollable-x .el-table__body-wraper{ overflow:visible; } .el-table__body-wraper{ overflow:visible; }这个样式正式固定列的样式，并且这个样式没有写在任何class的内部，直接污染了整个项⽬的所有⽤到固定列的el-table组件。最后删掉这些样式问题解决。总结：1. 感谢同事的帮助2. 使⽤UI框架时样式代码⽤