template:
<el-tree :data="TreeMenu"
:current-node-key="currentLivingId"
:props="{
label: 'orgName',
children: 'children'
}"
ref="popularTree" lazy
:load="loadTreeMenuNode"
node-key="id"
@node-click="handleNodeClick"
highlight-current ></el-tree>
data:
TreeMenu: [],// 機構數據
currentLivingId: "",//默認的選中菜單值
methods:(通過父級id獲取子級)
cscpOrgsAll() { // 獲取動態機構樹菜單
return new Promise((resolve) => {
this.$api.cscpOrgsAll(this.queryCscpOrgsAll).then((res) => {//調接口渲染樹形菜單數據
let data = res.data || {};
let cscpOrgDTOs = data.cscpOrgDTOs || [];
resolve(cscpOrgDTOs);
})
})
},
loadTreeMenuNode(node, resolve) { // 懶加載子級數據
if (node && node.key) {
this.queryCscpOrgsAll.parentId = node.key;
this.cscpOrgsAll().then((data) => {
resolve(data);
})
}
},
handleNodeClick(node) { // 選擇某個node節點
this.orgId = node.id;//選擇的id
this.ApprovalList();//調接口(要渲染的對應的id數據)
},