el-table表格固定列el-table__fixed导致滚动条无法拖动

扶苏1002

于 2024-07-04 09:58:51 发布

阅读量181

点赞数 2

分类专栏： ElementUI 文章标签： vue.js 前端 javascript

本文链接：https://blog.csdn.net/qq_44741577/article/details/140171413

版权

ElementUI 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

在这里插入图片描述

这里10px是底部滚动条的高度

/* el-table表格固定列el-table__fixed导致滚动条无法拖动 */
.el-table__fixed {
	height: calc(100% - 10px) !important;
}
/* 用于消除固定列下方的伪元素边框线 */
.el-table__fixed:before {
	height: 0px;
}

如何自定义修改滚动条

// 整个滚动条--可以设置滚动区背景色
::-webkit-scrollbar {
	width: 10px !important; //纵向滚动条的宽度
	height: 10px; //横向滚动条的高度
}
// el-table开启fixed定位的时候，会动态获取scrollbar的高度计算距离，
// 如果自定义了webkit-scrollbar 一定要同步修改.el-scrollbar__wrap::-webkit-scrollbar
// 否则会出现列错位的情况
.el-scrollbar__wrap::-webkit-scrollbar {
	width: 10px !important; //纵向滚动条的宽度
	height: 10px; //横向滚动条的高度
}