解决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>
相关推荐
就叫飞六吧42 分钟前
vue2和vue3全面对比
前端·javascript·vue.js
qq_2518364571 小时前
基于ssm vue uniapp实现的爱心小屋公益机构智慧管理系统
前端·vue.js·uni-app
._Ha!n.1 小时前
Vue基础(二)
前端·javascript·vue.js
程序员的春天11 小时前
基于Springboot+Vue的线上课堂系统(含源码数据库)
数据库·vue.js·spring boot
theoxiong2 小时前
深度解析:Tkinter 界面布局与优化技巧
python·ui·pyqt·tkinter
程序员大金4 小时前
基于SpringBoot+Vue+MySQL的在线学习交流平台
java·vue.js·spring boot·后端·学习·mysql·intellij-idea
qq_2518364574 小时前
基于SpringBoot vue 医院病房信息管理系统设计与实现
vue.js·spring boot·后端
肖哥弹架构5 小时前
Vue组件开发:从入门到架构师
前端·vue.js·程序员
持久的棒棒君6 小时前
ElementUI 2.x 输入框回车后在调用接口进行远程搜索功能
前端·javascript·elementui
一 乐6 小时前
租拼车平台|小区租拼车管理|基于java的小区租拼车管理信息系统小程序设计与实现(源码+数据库+文档)
java·数据库·vue.js·微信·notepad++·拼车