解决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>
相关推荐
软弹2 小时前
Vue2 的数据响应式原理&&给实例新增响应式属性
前端·javascript·vue.js
weixin_638303113 小时前
uniapp组合式和选项式
javascript·vue.js·uni-app
【赫兹威客】浩哥3 小时前
【赫兹威客】框架模板-前端命令行部署教程
前端·vue.js
一殊酒4 小时前
【前端开发】Vue项目多客户配置自动化方案【一】
前端·vue.js·自动化
切糕师学AI4 小时前
Vue 中 keep-alive 组件的生命周期钩子
前端·vue.js·keep-alive·生命周期·activated·deactivated
daols884 小时前
vue2 表格如何使用 vxe-table 带列头复制单元格内容同步到 excel 中
vue.js·excel·vxe-table
ethan.Yin4 小时前
element-plus 二次封装遇到的一点疑惑
javascript·vue.js·ecmascript
切糕师学AI5 小时前
Vue 中的 keep-alive 组件
前端·javascript·vue.js
ll_god5 小时前
android compose ui 结合 ViewModel适配方案
android·ui
芳草萋萋鹦鹉洲哦5 小时前
【Vue 3/Vite】Tailwind CSS稳定版安装替代CDN引入
前端·css·vue.js