遞歸樹處理，配合vue的vueTreeselect組件使用

在項目中經常會使用到tree，並且需要對遞歸樹進行操作。

在vue項目中，使用vue-treeselect插件（https://vue-treeselect.js.org/）

使用中遇到的問題：

　　1、接口返回的數據格式中，children:null，也就是說哪怕已經是最子節點，children為空，接口依舊會存在這個屬性。由於這個屬性的存在，導致節點前存在一個小三角符號，展開又是空子節點。因此頁面需要對children為空的數據屬性進行遞歸判斷刪除。

　　

　　解決方法：

遞歸函數的具體寫法：
diGuiTree(item) {  //遞歸便利樹結構
  item.forEach(item => {
    item.children === '' || item.children === undefined || item.children === null ?　　　　　　　　
      delete item.children : this.diGuiTree(item.children);
  })
},

 2、接口返回的數據格式中，並不包括禁止選擇的項目。由於項目需要根據當前選擇的節點，在編輯父節點的時候禁止下選擇當前的節點及其子節點。根據vue-treeselect的數據規則，isDisabled = false禁止選擇。因此需要遞歸判斷當前tree ID是否等於選擇的節點ID

 

遞歸函數的具體寫法：

diGuiTreeEdit(item,compID) {  // 編輯情況下，禁止選擇當前節點及其子節點
 let data = item;
 let treeAry = [];
 for (let i in data) {
   let v = data[i];
   let node = {};
   if (v === null || v === undefined) {}
   else {
     if (v.children && v.children.length > 0) {
       if (v.id == compID) {
         node.isDisabled = true;
       } else {
         node.isDisabled = false;
       }
       node.id = v.id;
       node.label = v.label;
       node.name = v.name;
       node.children = this.diGuiTreeEdit(v.children, compID);
       treeAry.push(node);
     } else {
       if (v.id == compID) {
         node.isDisabled = true;
       } else {
         node.isDisabled = false;
       }
       node.id = v.id;
       node.label = v.label;
       node.name = v.name;
       treeAry.push(node);
     }
   }
 }
 return treeAry;
},