element-UI el-tree横向滚动条

添加如下样式

<div class="device-tree"><el-scrollbar style="height:100%"><el-tree :data="data" :props="defaultProps" @node-click="handleNodeClick"></el-tree></el-scrollbar>
</div>
<style>.el-scrollbar .el-scrollbar__wrap {overflow-x: hidden;}.el-tree>.el-tree-node {min-width: 100%;display:inline-block;}
</style>

注意：

1.device-tree设置宽和高，

2.el-scollbar设置100%

3.scoped以及样式覆盖问题，保证样式生效就可以实现横向和竖向滚动条

element-UI el-tree横向滚动条相关推荐

Element 表格固定列横向滚动条无法拖动的问题解决
在Element-UI中,当对表格列进行固定后,底部的横向滚动条就无法拖动了,主要的问题就是固定区域盖住了横向滚动条. 方案一:修改el-table__body-wrapper样式的层级,随便设个层级 ...
element table el-table 添加横向滚动条宽度超出时横向滚动条不出现，固定表头完美方案
项目场景: 横纵内容过多时,表格横向宽度超出后,滚动条没有出现问题描述: 表格横向宽度超出后,滚动条没有出现,如下图所示原因分析: 查了一下网上其他的解决方案感觉不是特别好,f12查看了下elem ...
element ui封装 tree下拉框
展示: 子组件封装  <template><el-popoverref="popover"placement=& ...
vue中element ui 中tree组件怎么自定义前缀图标呢?
一问题饿了么ui 默认的图标样式是: 1. 一个箭头, 展开自动顺时针旋转90°, 以上的条件是该节点有子节点, 2. 如果是没有子节点的节点, 是默认空白图标的(这里我认为他不是没有, 而是有占 ...
Element UI——滚动条组件(ElScrollBar)修改.el-scrollbar__wrap和el-scrollbar__view的CSS属性
基本概念 el-scrollbar:Element UI隐藏组件. 注意事项: 1.el-scrollbar的父层要有固定高度 2.el-scrollbar的高度要设成100% 3.如果出现横滚动条, ...
Vue + Element UI——滚动条el-scrollerbar和无限滚动指令v-infinite-scroll整合解决方案
基本概念 el-scrollbar:Element UI隐藏组件. 注意事项: 1.el-scrollbar的父层要有固定高度 2.el-scrollbar的高度要设成100% 3.如果出现横滚动条, ...
elementui树状菜单tree_Vue+Element UI 树形控件整合下拉功能菜单（tree + dropdown +input）...
这篇博客主要介绍树形控件的两个小小的功能: 下拉菜单输入过滤框以CSS样式为主,也会涉及到Vue组件和element组件的使用. 对于没有层级的数据,我们可以使用表格或卡片来展示.要展示或建立层级 ...
Element ui tree树形控件获取当前节点id和父节点id
低版本Element ui tree树形控件获取当前节点id和父节点id的方法:点击查看最新版本Element ui tree树形控件获取当前节点id和父节点id教程: 1.找到node_modul ...
Vue+Element UI 树形控件整合下拉功能菜单（tree + dropdown +input）
这篇博客主要介绍树形控件的两个小小的功能: 下拉菜单输入过滤框以CSS样式为主,也会涉及到Vue组件和element组件的使用. 对于没有层级的数据,我们可以使用表格或卡片来展示.要展示或建立层级 ...
修改element ui tree 搜索功能，实现分级搜索，关键字高亮
element ui 里面的tree 自带的搜索功能是默认搜索的全部数据,有关键字的显示,没有的不显示需求: 在element UI tree 原有功能不变的情况下新加 1)搜索 tree 时,如果 ...

element-UI el-tree横向滚动条

element-UI el-tree横向滚动条相关推荐

最新文章

热门文章