AI 助理
备案控制台
开发者社区 开发与运维 文章 正文

el-table横向滚动条不显示问题

2022-11-14 1901
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介： el-table横向滚动条不显示问题

背景

在Vue中使用el-table，设置表格高度和宽度后，表格内容超出，横向滚动条没有显示。

解决办法

设置滚动条宽度和高度即可。

/* 设置滚动条宽度和高度 *//deep/ .el-table__body-wrapper::-webkit-scrollbar {
width: 8px; /* 横向滚动条 */height: 8px; /* 纵向滚动条 必写 */}
/* 设置滚动条样式 *//deep/ .el-table__body-wrapper::-webkit-scrollbar-thumb {
background-color: #dde;border-radius: 3px;
}

image.png

文章标签：
JavaScript
Boale_H
目录
相关文章
前端随想
|
前端开发 API
解决el-table中横向滚动条无法显示的问题
解决el-table中横向滚动条无法显示的问题
前端随想
1875 0
Lux_Sun
Element UI - el-scrollbar 如何隐藏横向滚动条？
Element UI - el-scrollbar 如何隐藏横向滚动条？
Lux_Sun
595 0
GoodTime
|
JavaScript
element-UI el-table动态显示隐藏列造成固定一侧的列(fixed=“left/right“)错误显示
问题原因：多个tabs共用一个实体，动态显示隐藏列 出现了固定在右侧的列(fixed="right")错位 【解决方案】 表格的重新布局，只要table数据发生变化的时候就重新渲染表格 ```js this.$nextTick(() => { this.$refs.formname.doLayout() }) ``` 参考element官方文档 ![请在此添加图片描述](https://developer-private-1258344699.cos.ap-guangzhou.myqcloud.com/column/article/5877188/20231030-e40
GoodTime
241 0
element-UI el-table动态显示隐藏列造成固定一侧的列(fixed=“left/right“)错误显示
vaelcy
element ui table 表格高度自适应
设置element ui table 表格高度自适应
vaelcy
2175 0
程序员大阳
el-input el-select调整字体及内边距
1. 背景 el-input输入框默认提供的字体较小，且内边距较大。 这是为了提供统一的样式和好看的外观。 在某些情况下，我们希望使用较大的字体，且让输入框的内边距小一些以便容纳更多东西。
程序员大阳
2546 0
讓丄帝愛伱
layui select 设置宽度
layui select 设置宽度
讓丄帝愛伱
173 0
凯小默
element-ui里的el-table在grid布局下切换数据有滚动条时不断增加？
element-ui里的el-table在grid布局下切换数据有滚动条时不断增加？
凯小默
84 0
Mr.Meng_95
|
人工智能 自然语言处理 语音技术
el-select下拉框高度有效设置不污染
el-select下拉框高度有效设置不污染
Mr.Meng_95
601 0
embelfe_segge
|
JavaScript
element-ui el-table 表格中行高和字体大小调整
element-ui el-table 表格中行高和字体大小调整
embelfe_segge
3325 0
程序员大阳
Element表格el-table固定表头且高度占满
本文目录 1. 固定表头 2. 占满高度 3. 使用vh占满高度 4. 动态调整高度
程序员大阳
2268 0