解决element ui tree组件不产生横向滚动条

结果是这样的

需要在tree的外层,包一个父组件

html 复制代码
    <div class="tree">
        <el-tree :data="treeData" show-checkbox default-expand-all></el-tree>
    </div>

在css里面这样写,样式穿透按自己使用的css编译器以及框架要求就好

css 复制代码
<style lang="scss">
.tree {
    overflow-y: auto;
    overflow-x: auto;
    width: 500px;
    height: 500px;
    background-color: #ffffff;
    border: #333 solid 1px;
}
.el-tree {
    min-width: 100%;
    display: inline-block !important;
}
::v-deep {
    .el-tree-node > .el-tree-node__children {
        overflow: visible;
    }
}
</style>
相关推荐
布局呆星7 小时前
Vue3 | 组件通信学习小结
前端·vue.js
Ruihong11 小时前
你的 Vue 3 reactive(),VuReact 会编译成什么样的 React?
vue.js·面试
Ruihong11 小时前
你的 Vue 3 ref(),VuReact 会编译成什么样的 React?
vue.js·面试
一 乐11 小时前
酒店预订|基于springboot + vue酒店预订系统(源码+数据库+文档)
java·数据库·vue.js·spring boot·论文·毕设·酒店预订系统
嗜好ya11 小时前
解决 Vite 项目中 import.meta.env 变量为 undefined 的问题
前端·javascript·vue.js
浩星12 小时前
「Vue3 + Cesium 最佳实践」完整工程化方案
前端·javascript·vue.js
小李子呢021112 小时前
前端八股Vue(5)---v-if和v-show
前端·javascript·vue.js
YiuChauvin12 小时前
vue2中使用 AntV G6
javascript·vue.js
踩着两条虫13 小时前
目录:VTJ.PRO 在线应用开发平台技术揭秘
vue.js·低代码·ai编程
peak_chan13 小时前
通过vue-virtual-scroller封装虚拟滚动el-select
前端·javascript·vue.js