qq_40364610的博客

表格上下滚动条控制

效果图：实现方式：1.加一个div,宽度和表格相同：2.监听表格宽度，并给元素和滚动条元素绑定滚动事件：原理：两个滚动条滚动时，同时控制另一个滚动条滚动。tableWidth: { handler(newVal, oldVal) { // 监听滚动条 setTimeout(() => { this.tableDom = this.$refs.tableRef.bodyWrapper this.tableDom.addEventListener(

<el-table ref="multipleTable" :data="tableData" max-height="430" style="width: 100%"> <el-table-column prop="schoolName" label="学科" align="center" :min-width="firstColumnWidth" fixed> <template slot="header" slot-scope="

.el-table__fixed, .el-table__fixed-right { height: 100%!important;}

解决方案：/*解决表格fixed错位问题*/ .el-table{ overflow: auto; } .el-table__header-wrapper,.el-table__body-wrapper,.el-table__footer-wrapper{overflow:visible;} .el-table__body-wrapper{ overflow-x:visible !important; } /* 这个是为了解决前面样式覆盖之后伪类带出来的竖线 */

<el-table-column prop="schoolName" label="教师名" :min-width="firstColumnWidth" fixed> <template slot="header" slot-scope="scope"> {{firstColumn(scope)}} </template></el-table-column><el-table-column v-for="(item