1.element-ui中使用el-tree横向滚动条不显示
<div style="width:100%;height:500px;overflow-y:auto;margin:0 auto;">
<el-tree ref="tree" class="filter-tree" :data="setUserstreeData" :props="defaultProps" :filter-node-method="filterNode" :highlight-current="true" @node-click="setReviewerNodeClick" default-expand-all node-key="id" :default-expanded-keys="[expandedKeys]">
</div>
::v-deep .el-tree-node :nth-child(2) {
padding: 1px;
overflow: visible;
}
或者
::v-deep .el-tree-node__label {
overflow-x: auto;
}
或者
//亲测有效
.el-tree>.el-tree-node{
min-width:100%;
display: inline-block;
}
2.给树el-tree名称后面添加备注
setUserstreeData: {
id: "10363048910990",
name: "dcsfzfvsdzf有限公司",
progress: "1",
child: [
{
id: "13539157974",
name: "sdavgzsdfgvdsfv有限公司",
child: null,
progress: "0",
},
{
id: "1353981813010",
name: "dsavfgdsfdzsz术研究院",
progress: "0",
child: [
{
id: "13688129090",
name: "dfhsgfdgsdfgdf有限公司",
progress: null,
child: [
{
id: "1369024725506",
name: "sfgdfgdfg单位",
child: null,
progress: null,
},
{
id: "13694267522",
name: "gggggg单位",
child: null,
progress: null,
},
],
},
{
id: "136882545",
name: "ggngjjjjgfghfdg分公司",
child: null,
progress: null,
},
],
},
{
id: "135399959042",
name: "aaaaaa有限公司",
progress: "0",
child: [
{
id: "135398311516161",
name: "aaaddsssssss公司",
child: null,
progress: null,
},
],
},
],
},
this.getTreeName(this.setUserstreeData);
// 找到项目单位选中得id对应得二级单位
getTreeName(list) {
let _this = this;
list.forEach((item, index) => {
let a = item;
if (index < list.length) {
let mark = "";
if (a.progress == "2") {
mark = "(已完成)";
} else if (a.progress == "0" || a.progress == "1") {
mark = "(未完成)";
}
a.name = a.name + mark + "";
}
if (a.child && a.child.length > 0) {
console.log("a.child", a.child);
if (a.child && a.child.length > 0) {
_this.getTreeName(a.child);
}
}
});
return;
},