技術標籤：ztreejs

js修改zTree沒有子項的節點圖示為資料夾的方法

有時候，我們載入的zTree是這樣的，箭頭所指的節點沒有子節點，所以顯示白色的圖示。

但現在我們這個節點代表其實的不是一個子節點，而是代表一個空目錄（這裡通過node的sou屬性來區分），如何讓它顯示成資料夾圖示呢？

其實，只要找到這些代表目錄的節點，設定他們的isParent屬性為true，再呼叫api的refresh方法就行了。

具體程式碼如下：

$.fn.zTree.init($("#pageTree"), setting, zNodes);//初始化tree
fixIcon(
 
);//呼叫修復圖示的方法。方法如下：

//修正zTree的圖示，讓檔案節點顯示資料夾圖示
function fixIcon(){
    var treeObj = $.fn.zTree.getZTreeObj("pageTree");
    //過濾出sou屬性為true的節點（也可用你自己定義的其他欄位來區分，這裡通過sou儲存的true或false來區分）
    var folderNode = treeObj.getNodesByFilter(function (node) { return node.sou});
    for(j=0 ; j<folderNode.
 
length; j++){//遍歷目錄節點，設定isParent屬性為true;
        folderNode[j].isParent = true;
    }
    treeObj.refresh();//呼叫api自帶的refresh函式。
}

經過這樣處理後，效果如下：
這裡寫圖片描述

雖然fdsa下面沒有子節點，但是仍可以顯示資料夾樣式的圖示。

本文介紹的方法不需要修改樣式之類的操作。