前面我們封裝了一維陣列(具備樹形結構相關屬性)處理成樹形結構的方法:https://www.cnblogs.com/coder--wang/p/15013664.html
接下來我們來一波反向操作，封裝一個可以將樹形結構的資料扁平化的方法。這種場景在業務中還是很常見的，比如一個級聯選單，有時候你需要判斷某個id或者某個欄位，是否存在於該級聯選單的多維陣列中，亦或者你需要將該多維陣列中的欄位進行處理，那麼此時，對這個樹形的複雜陣列進行降維就顯得很有必要了！下面直接上程式碼：
1 /**
2 *
3 * @param {Array} arrs 樹形資料
4 * @param {string} childs 樹形資料子資料的屬性名,常用'children'
5 * @param {Array} attrArr 需要提取的公共屬性陣列(預設是除了childs的全部屬性)
6 * @returns
7 */
8 function extractTree(arrs,childs,attrArr){
9 let attrList = [];
10 if(!Array.isArray(arrs)&&!arrs.length)return [];
11 if(typeof childs !== 'string')return [];
12 if(!Array.isArray(attrArr)||Array.isArray(attrArr)&&!attrArr.length){
13 attrList = Object.keys(arrs[0]);
14 attrList.splice(attrList.indexOf(childs), 1);
15 }else{
16 attrList = attrArr;
17 }
18 let list = [];
19 const getObj = (arr)=>{
20 arr.forEach(function(row){
21 let obj = {};
22 attrList.forEach(item=>{
23 obj[item] = row[item];
24 });
25 list.push(obj);
26 if(row[childs]){
27 getObj(row[childs]);
28 }
29 })
30 return list;
31 }
32 return getObj(arrs);
33 }
執行：
收工！對樹形結構資料的組裝和降維都已經實現，希望給大家帶來一些幫助，有bug或不足歡迎給我留言哦~
更多專案中常見的方法封裝，傳送門：https://github.com/wangruibin666/wang-utils
腳踏實地行，海闊天空飛~