JS遍歷樹狀資料,選擇需要的欄位重構一個新的樹狀資料
1、原樹狀結構資料
treeData = [
{
"id": 1,
"parentId": 0,
"type": "結生上取段日名求將查由六才酸商驗又每。",
"referenceId": 234,
"sort": 29,
"code": "你計世派列太是後氣住內帶卻所就。",
"name": "直按種白親叫也總較機低及省。",
"userCount": 196,
"description": "空價等名共通七鬥海共度實養族識觀東。",
"modifyDate": null,
"makeBillMan": "test",
"createDate": null,
"modifier": "test",
"deleteFlag": false,
"children": [
{
"id": 2,
"parentId": 1,
"type": "結生上取段日名求將查由六才酸商驗又每。",
"referenceId": 234,
"sort": 29,
"code": "你計世派列太是後氣住內帶卻所就。",
"name": "直按種白親叫也總較機低及省。",
"userCount": 196,
"description": "空價等名共通七鬥海共度實養族識觀東。",
"modifyDate": null,
"makeBillMan": "test",
"createDate": null,
"modifier": "test",
"deleteFlag": false,
"children": [
{
"id": 3,
"parentId": 2,
"type": "結生上取段日名求將查由六才酸商驗又每。",
"referenceId": 234,
"sort": 29,
"code": "你計世派列太是後氣住內帶卻所就。",
"name": "直按種白親叫也總較機低及省。",
"userCount": 196,
"description": "空價等名共通七鬥海共度實養族識觀東。",
"modifyDate": null,
"makeBillMan": "test",
"createDate": null,
"modifier": "test",
"deleteFlag": false,
"children": []
}
]
}
]
}
要求:新建的陣列要有和源資料一樣的結構,其中只保留label=name,和children欄位,children陣列為空時去掉children欄位。
data() {
return {
treeData: null,
newTreeList: []
}
},
created() {
this.getTreeList([this.treeData],this.newTreeList);
},
methods:{
// 遞迴樹狀資料
getTreeList(treeList,newTreeList) {
treeList.map(c=>{
let tempData={
label:c.name
}
if(c.children && c.children.length>0){
tempData.children=[]
this.getTreeList(c.children,tempData.children)
}
newTreeList.push(tempData)
})
}
}
最終資料
相關文章
- 樹狀的資料結構的建立資料結構
- 資料結構——樹與二叉樹的遍歷資料結構二叉樹
- 資料結構——樹狀陣列資料結構陣列
- 資料結構 二叉樹遍歷資料結構二叉樹
- 【資料結構】二叉樹的建立與遍歷資料結構二叉樹
- 用python講解資料結構之樹的遍歷Python資料結構
- 遞迴遍歷樹狀結構優雅實現遞迴
- 樹狀資料結構儲存方式—— CUD 篇資料結構
- 位運算-設計資料庫表的多選狀態欄位資料庫
- 樹狀資料結構儲存方式——查詢篇資料結構
- 資料結構之真別多想—樹狀陣列資料結構陣列
- 【資料結構&演算法】11-樹基礎&二叉樹遍歷資料結構演算法二叉樹
- js資料結構--樹(tree)JS資料結構
- 資料結構與演算法-二叉樹遍歷資料結構演算法二叉樹
- layui前端選單構建-批量刪除-彈框填寫-樹狀選單-樹狀下拉框選擇treeSelectUI前端
- 重溫資料結構系列--樹資料結構
- postgresql中資料表如何透過一個欄位標識資料行多種狀態?SQL
- 一個篩選mongo存在某個欄位的資料的技巧Go
- 一本正經的聊資料結構(5):二叉樹的儲存結構與遍歷資料結構二叉樹
- 樹的遍歷方式
- Vue動態構建混合資料Treeselect選擇樹及巨樹問題的解決方法Vue
- 重學資料結構(六、樹和二叉樹)資料結構二叉樹
- 重學資料結構之樹和二叉樹資料結構二叉樹
- 通過css類/選擇器選取元素文件結構和遍歷元素樹的文件CSS
- js資料處理——遍歷JS
- 高效遍歷匹配Json資料,避免巢狀迴圈[轉]JSON巢狀
- 資料結構——樹資料結構
- 資料結構-樹資料結構
- js生成動態樹狀結構及排序JS排序
- [資料結構]二叉樹的前中後序遍歷(遞迴+迭代實現)資料結構二叉樹遞迴
- MySQL資料庫索引選擇使用B+樹MySql資料庫索引
- 在資料庫表中加一個狀態欄位可以代替軟刪除嗎?資料庫
- 樹的層次遍歷
- [資料結構] 根據前中後序遍歷中的兩種構造二叉樹資料結構二叉樹
- 樹形資料構造的方法
- 資料結構之樹( 線段樹,字典樹)資料結構
- 演算法與資料結構--空間複雜度O(1)遍歷樹演算法資料結構複雜度
- 資料結構(樹):二叉樹資料結構二叉樹