Summary of problems encountered in the use of ztree

background

There are many tree diagrams in the project, and ztree was selected after research, and the project is a vue framework

question

1. The ids of the ztrees of different single pages are the same, causing the ztrees to sometimes display and sometimes not to be displayed.
Solution: Different vue single pages use different ztree ids

2. The data of ztree is obtained in the background. The first element is the parent, but there is no child element, and the icon of ztree is displayed as a child. Solution:
Get all nodes, if the parent node has no child nodes, set isParent = true

var nodes = this.$refs.ztree.getNodes();
if(nodes.length > 0){
    
    
   for(let item of nodes){
    
    
     this.isParent = true
   }
}

3. Check the department tree

//resultArr为从服务器获得的所有树元素，depIds为获得的所有选中项
var depIds = this.$refs.ztree.checkedNodes;
for(let item of resultArr){
    
    
  for(let i of depIds){
    
    
    if(item.id == i){
    
    
       item.checked = true
    }
  }
}