【el-table】横向滚动条加粗后,滚动到固定列下被遮挡,已解决

横向滚动条按要求加粗后,遇到的问题:列表的操作列是固定在最右侧的,当滚动条滑动到最右侧的时候,滚动条被遮挡了

我尝试了几种方法都不行,比如找到.el-table__fixed-right .el-table__fixed-footer-wrapper ,修改bottom的值,无效

解决方法:

首先,el-table设置了固定列之后,会有两套不同的列名

如截图所示,普通列body的高度是362px(含横向滚动条12px的高度)

而固定列body的高度是354px

看红色圈起来的部分,固定列的body高度其实超了,所以挡住了滚动条

固定列body的高度等于普通列body的高度 - 横向滚动条的高度

按示例的普通列高度362px - 横向滚动条的高度12px = 350px

所以固定列的body高度改为350px

bash 复制代码
/deep/ .el-table__fixed-body-wrapper{
  height: 350px !important;//el-table__body-wrapper高362  - 横向滚动条12 = 350
}

现在就不遮挡了

相关推荐
WYiQIU1 小时前
11月面了7.8家前端岗,兄弟们12月我先躺为敬...
前端·vue.js·react.js·面试·前端框架·飞书
娃哈哈哈哈呀2 小时前
formData 传参 如何传数组
前端·javascript·vue.js
513495923 小时前
Vite环境变量配置
vue.js
2503_928411564 小时前
11.24 Vue-组件2
前端·javascript·vue.js
g***B7385 小时前
JavaScript在Node.js中的模块系统
开发语言·javascript·node.js
Z***25805 小时前
JavaScript在Node.js中的Deno
开发语言·javascript·node.js
weixin79893765432...5 小时前
Vue + Express + DeepSeek 实现一个简单的对话式 AI 应用
vue.js·人工智能·express
高级程序源5 小时前
springboot社区医疗中心预约挂号平台app-计算机毕业设计源码16750
java·vue.js·spring boot·mysql·spring·maven·mybatis
cypking6 小时前
Vue 3 + Vite + Router + Pinia + Element Plus + Monorepo + qiankun 构建企业级中后台前端框架
前端·javascript·vue.js
San30.6 小时前
ES6+ 新特性解析:让 JavaScript 开发更优雅高效
开发语言·javascript·es6