2016-11-11 61 views
1

我以flat tree的形式從服務器獲取數據。然後我將數據JsTree庫建立一棵樹給我。 傳輸數據之前JsTree我過濾數據並刪除沒有孩子的folder類型的空元素。刪除陣列中沒有子項的所有元素

下面是一些代碼,我得到了:

dataFilter: function (jsonString) { 
    function getItemList(item, list) { 
    if (item === null) { 
     return null; 
    } 
    if (item.parent === "#" && item.type !== "folder") { 
     return item; 
    } else { 
     if (item.type === "folder") { 
     var itemFolder = _.findWhere(list, { parent: item.id }); 
     if (itemFolder) { 
      return item; 
     } 
     } else { 
     return item; 
     } 
    } 
    return null; 
    }; 
    function removeEmptyFolder(list) { 
    console.log(list); 
    var treeListTemp = []; 
    for (var i = 0; i < list.length; i++) { 
     treeListTemp.push(getItemList(list[i], list)); 
    } 
    var treeList = []; 
    for (var j = 0; j < treeListTemp.length; j++) { 
     var k = getItemList(treeListTemp[j], treeListTemp); 
     if (k === null) { 
     removeEmptyFolder(_.filter(treeListTemp, 
            function(item) { 
      return item !== null; 
     })); 
     } else { 
     treeList.push(k); 
     } 
    } 
    //console.log(treeList); 
    return treeList; 
    }; 
    return JSON.stringify(_.filter(removeEmptyFolder(JSON.parse(jsonString)), 
           function (item) { 
    return item !== null; 
    })); 
} 

這裏是一個工作示例https://jsfiddle.net/nkqgot2a/11/

此代碼的工作差不多吧。但是如果最後一個元素包含一個孩子,那麼它不會從列表中刪除。數據過濾後,元素「文件夾9」不應出現在列表中。

請告訴我如何解決我的功能,因此,它會刪除所有空文件夾?

由於尚未在我看來,該遞推通過的時間過多而引起的。

+0

' 「文件夾9」'___does___有孩子做了很多的變化。 ''文件夾12「'的父母是''38」',它是''文件夾9「'。它不是空的,所以它不會被刪除。 – Cerbrus

+0

@Cerbrus在第一個函數調用'removeEmptyFolder'移除元素''文件夾11「'後。第二次調用函數通過遞歸發生''文件夾12「'元素移除。當第三次調用該函數時,文件夾「9」沒有包含子項。 –

+1

由於'文件夾9'是一個文件夾,並有父''',並根據您的條件'if(item.parent ===「#」&& item.type!==「文件夾」){ return item; }它的返回項目。問題只發生在那些位於根目錄的文件夾中 –

回答

2

檢查我對此非常

var data = [{ 
 
    "id": "15", 
 
    "parent": "#", 
 
    "title": "folder 1", 
 
    "type": "folder" 
 
}, { 
 
    "id": "16", 
 
    "parent": "15", 
 
    "title": "file 2", 
 
    "type": "file" 
 
}, { 
 
    "id": "21", 
 
    "parent": "25", 
 
    "title": "file 6", 
 
    "type": "file" 
 
}, { 
 
    "id": "25", 
 
    "parent": "15", 
 
    "title": "folder 10", 
 
    "type": "folder" 
 
}, { 
 
    "id": "33", 
 
    "parent": "#", 
 
    "title": "folder 3", 
 
    "type": "folder" 
 
}, { 
 
    "id": "34", 
 
    "parent": "33", 
 
    "title": "folder 4", 
 
    "type": "folder" 
 
}, { 
 
    "id": "35", 
 
    "parent": "25", 
 
    "title": "file 5", 
 
    "type": "file" 
 
}, { 
 
    "id": "36", 
 
    "parent": "#", 
 
    "title": "file 7", 
 
    "type": "file" 
 
}, { 
 
    "id": "37", 
 
    "parent": "#", 
 
    "title": "folder 8", 
 
    "type": "folder" 
 
}, { 
 
    "id": "38", 
 
    "parent": "#", 
 
    "title": "folder 9", 
 
    "type": "folder" 
 
}, { 
 
    "id": "39", 
 
    "parent": "40", 
 
    "title": "folder 11", 
 
    "type": "folder" 
 
}, { 
 
    "id": "40", 
 
    "parent": "38", 
 
    "title": "folder 12", 
 
    "type": "folder" 
 
}]; 
 

 
function dataFilter(jsonString) { 
 
    function getItemList(item, list) { 
 
     if (item) { 
 
      if (item.type === "folder") { 
 
       var itemFolder = _.findWhere(list, { 
 
        parent: item.id 
 
       }); 
 
       if (itemFolder) { 
 
        return item; 
 
       } 
 
      } else { 
 
       return item; 
 
      } 
 
     } 
 
     return null; 
 
    }; 
 

 
    function removeEmptyFolder(list) { 
 
     var tempItem = null; 
 
     var i; 
 
     for (i = 0; i < list.length; i++) { 
 
      tempItem = getItemList(list[i], list); 
 
      if (tempItem == null) { 
 
       break; 
 
      } 
 
     } 
 
     if (tempItem == null) { 
 
      if (_.size(list) > 0) { 
 
       list.splice(i, 1); 
 
       removeEmptyFolder(list); 
 
      } 
 
     } 
 
     return list; 
 
    }; 
 
    return removeEmptyFolder(jsonString); 
 
} 
 

 

 
$(document).ready(function() { 
 
    var $beforelist = $('#before_json'); 
 
    $.each(data, function() { 
 
     $('<li>' + this.title + '</li>').appendTo($beforelist); 
 
    }); 
 
    var $afterlist = $('#after_json'); 
 
    $.each(dataFilter(data), function() { 
 
     $('<li>' + this.title + '</li>').appendTo($afterlist); 
 
    }); 
 
});
<pre id="before_json"></pre> 
 
<p>After:</p> 
 
<pre id="after_json"></pre> 
 

 

 
<script src="https://code.jquery.com/jquery-3.1.1.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>