一、tree元件**
後台返回資料：id表示專案唯一性id、depth表示層級、parentid表示父級id、name表示節點名稱。
[,,
]
轉換資料結構，json轉化為樹形結構
methods: ,
//先找出第一層級，然後往裡追加資料
handledata(arr)
dataarray.push(objtemp);}})
this.data2treedg(arr, dataarray)
},//遞迴追加資料
data2treedg(datas, dataarray)
childrenarray.push(objtemp);}}
dataarrayindex.children = childrenarray;
//有兒子節點則遞迴
if (childrenarray.length > 0)
}this.treedata = dataarray;
return dataarray;
},}
格式化後資料結構可滿足tree元件需求
[]},
]}
]
此解決問題思路，也可用於動態導航欄資料處理。
六、優化
methods: arr resdata列表原始資料
* @param keys 自定義字段陣列
* @param originid 根目錄parentid，預設為0, 可自定義傳入 如『-1』
* @returns
*/handledata(arr = , keys = , originid = 0) )
const dataarray =
for (let i = 0; i < arr.length; i++)
// 追加額外引數**********
if (array.isarray(keys)) )
} else if (keys && typeof keys === 'string')
dataarray.push(objtemp)
break}}
return this.data2treedg(arr, dataarray, keys, originid)
},// 遞迴追加資料
data2treedg(datas, dataarray, keys, originid)
// 追加額外引數**********
if (array.isarray(keys)) )
} else if (keys && typeof keys === 'string')
childrenarray.push(objtemp)}}
// 有兒子節點則遞迴
if (childrenarray.length > 0)
}return originid ? dataarray[0].children : dataarray
},// 獲取父子級字串組合
getcascaderstr(id) }}
},// 獲取父子級id組合陣列
getcascaderarr(id) }}
},//根據id 遍歷陣列 返回目標物件
checktypeobj(id)
}return nowtypeobj_
}}```
tree命令生成專案樹形結構
linux和windows都有自帶的tree命令 mac則需要安裝，才能使用 tree命令以樹狀圖列出目錄的內容。tree option dir 備註，tree命令中，dir預設為當前目錄 選項含義 a顯示所有檔案和目錄 d只顯示目錄名稱，不顯示檔案 d列出檔案或目錄的更改時間 l num 顯示nu...
python生成樹形結構 選單 tree
首先需要設計表結構，包含父子關聯關係，例如 class menu models.model 許可權 title models.charfield max length 128,unique true verbose name 標題 name models.charfield max length 1...
Tree 1 樹形結構資料呈現的遞迴演算法實現
在我的專案中，常常會用到樹形結構的資料，最為明顯的就是左邊選單欄，類似於window folder一樣的東西。而我之前一直是借助前端封裝好的ztree等工具實現展示，而後台則通常使用遞迴進行資料的查詢。通常，我們在設計資料庫表的時候，一般會使用三個字段 id，name，pid。如下圖所示 首先是建立...