解决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>
相关推荐
reddingtons17 小时前
Illustrator 3D Mockup:零建模,矢量包装一键“上架”实拍
人工智能·ui·3d·aigc·illustrator·设计师·平面设计
言之。17 小时前
AI时代的UI发展
人工智能·ui
猫头虎-前端技术17 小时前
小白也能做AI产品?我用 MateChat 给学生做了一个会“拍照解题 + 分步教学”的AI智能老师
前端·javascript·vue.js·前端框架·ecmascript·devui·matechat
前端加油站18 小时前
使劲折腾Element Plus的Table组件
前端·javascript·vue.js
十五喵18 小时前
智慧物业|物业管理|基于SprinBoot+vue的智慧物业管理系统(源码+数据库+文档)
java·前端·数据库·vue.js·spring boot·毕设·智慧物业管理系统
用户8417948145618 小时前
如何用 vxe-table 实现粘贴数据自动进入新增行与新增列
vue.js
朕的剑还未配妥19 小时前
vue2中transition使用方法解析,包含底部弹窗示例、样式未生效踩坑记录
前端·vue.js
w***741719 小时前
SpringBoot + vue 管理系统
vue.js·spring boot·后端
灵犀坠19 小时前
前端核心知识体系梳理:从Vue 3到现代CSS与JavaScript
前端·javascript·vue.js
lcc18719 小时前
Vue3 新的组件
前端·vue.js