项目中使用到element-ui的el-tree组件,现在要求使用懒加载加载数据,需要默认展开并选中其中几个节点,尝试使用:default-checked-keys="defaultSelectNode"
但是因为懒加载id未知。
<el-tree
:data="treeData"
:props="defaultProps"
:load="loadNode"
lazy
node-key="id"
@check="handleNodeClick"
show-checkbox
:filter-node-method="funcFilter"
ref="treeRef"
></el-tree>
懒加载方法的代码如下
loadNode(node, resolve) {
if (node.level === 0) {
this.firstNode = node;
console.log(node);
listTree(2).then((res) => {
console.log(res);
if (res.code == 200) {
let treeList = [];
this.treeListLevel1 = res.data[0].children;
res.data[0].children.forEach((item) => {
let treeItem = {
name: item.regionName,
regionId: item.id,
};
treeList.push(treeItem);
});
this.$nextTick(() => {
let nodedata = this.firstNode.childNodes[0];
nodedata.expanded = true;
nodedata.loadData();
});
return resolve(treeList);
} else {
this.$message({
type: "error",
message: res.message,
});
}
});
} else if (node.level == 1) {
this.treeListLevel1.forEach((item) => {
if (item.regionName == node.label) {
let param = {
regionId: item.id,
status: "all",
subrange: true,
};
deviceDataList(param).then((res) => {
if (res.code == 200) {
let childList = [];
this.treeListLevel2 = res.data;
console.log(res);
res.data.forEach((item) => {
let childItem = {
name: item.paramsInfo[0].name,
leaf: true,
eui: item.eui,
};
childList.push(childItem);
});
return resolve(childList);
} else {
this.$message({
type: "error",
message: res.message,
});
}
});
}
});
}
请问应该如何添加默认选中,实现如下图效果:
访问页面后默认展开第一个一级菜单项并默认选中第一个节点
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…