html使用两个方法
//树 点击方法,展开方法
<el-tree
:props="props"
:load="loadNode"
lazy
@node-click="clickTree"
@node-contextmenu="newChildTree"
node-key="id"
ref="tree"
:style="{
overflow: 'auto',
width: divTree.width + 'px',
}"
>
<template #default="{ node, data }">
<span class="custom-tree-node">
<span>{{ node.label }}</span>
<span class="operate">
<i
v-if="data.type!='staticScope'&&data.type!='group'"
class="iconfont icon-icon-test"
@click="editGroup(data, node)"
style="font-size: 20px"></i>
<i
v-if="data.type!='staticScope'&&data.type!='group'"
class="iconfont icon-sami-select"
@click="deleteGroup(data, node)"
style="font-size: 20px"></i>
<i
v-if="data.type!='staticScope'"
class="iconfont icon-add-select"
@click="newGroup(data, node)"
style="font-size: 20px; ,margin-left: 10px"
></i>
</span>
</span>
</template>
</el-tree>
方法操作
//点击 右侧是路由,点击刷新
clickTree(data, node) {
else if (node.parent.data && node.parent.data.name === '管理') {
this.$router.push({
name: 'device',
params: {
group: data.name,
group_id: data.groupId,
gateway_uuid: data.gateway_uuid,
},
}).then(() => {
this.menukey++;
});
else if(data.name === '管理'){
}
}
展开懒加载
//展开函数
loadNode(node, resolve) {
else if (node.data.name === '设备管理') {
this.deviceNode = node;
axios.get('egrouplist?account_id=1&parent_id=0').then((res) => {
const data = [];
const deviceData = res.data.data
for (let i = 0; i < res.data.data.length; i++) {
let id = res.data.data[i].group_id
let deviceName = res.data.data[i].group_name
let isLeaf = false
this.deviceNamedata.push(deviceName)
axios.get('uplist?account_id=1&parent_id='+id).then((res) => {
if(res.data.data.length == 0){
isLeaf = true
}
else{
isLeaf= false
}
data.push({
name: deviceName,
leaf: isLeaf,
groupId:deviceData[i].group_id,
parentId:deviceData[i].parent_id,
deep:deviceData[i].parent_id,
accountId:deviceData[i].account_id,
type:'device'
});
// console.log();
resolve(data);
})
}
});
},
//子
for(let j= 0;j<this.deviceNamedata.length;j++){
let nadata = []
if(node.data.name === this.deviceNamedata[j]){
const data = [];
this.deviceNode = node;
let groupId = node.data.groupId
axios.get('devicegrouplist?account_id=1&parent_id='+groupId).then((res) => {
const deviceData = res.data.data
for (let i = 0; i < res.data.data.length; i++) {
let id = res.data.data[i].group_id
let isLeaf = false
this.deviceNamedata.push(res.data.data[i].group_name)
axios.get('evicegrouplist?account_id=1&parent_id='+id).then((res) => {
if(res.data.data.length == 0){
isLeaf = true
}
else{
isLeaf= false
}
data.push({
name: deviceData[i].group_name,
leaf: isLeaf,
groupId:deviceData[i].group_id,
parentId:deviceData[i].parent_id,
deep:deviceData[i].parent_id,
accountId:deviceData[i].account_id,
type:'device'
});
resolve(data);
})
}
});
}
}
}