一个多层级类目数组，需求是扁平化为一维数组，组合成自己想要的数据
源数据：
var singleArr = [
{
"addTime": 1704178035000,
"contentId": 1978,
"id": 256393,
"sort": 0,
"floor": 0,
"firstFloorContent": {
"materialStatus": false,
"styleType": "NAVIGATE_COMPONENT",
"cateId": "_fplm7gsz2",
"title": "NAVIGATE_COMPONENT_1",
"signId": "_fplm7gsz2",
"componentKey": "NAVIGATE_COMPONENT",
"props": {
"metaData": {
"categoryType": {
"hrefType2": "",
"itemPickingPromotion": "",
"hrefTypeTag": "",
"biContentList": "",
"hrefTitle": "",
"adp": "",
"relativeUrl": "/RecommendSelection/Women-Clothing-sc-017172961.html",
"routeParams": "",
"internalLink": "",
"longestInternalLinkPrefix": "",
"categoryType": "1",
"adpImgSrc": "",
"selectTypeName": "",
"categoryIds": "",
"isBigImg": true,
"routePath": "",
"internalLinkPrefixes": [
],
"additionalConfig": {
"statusBarTitle": "",
"immersive": "0",
"anchor": "",
"statusBarTitleShow": "0",
"statusBarTitleColor": "black"
},
"hrefTarget": "017172961",
"hrefType": "itemPicking",
"ada": "",
"skuTopping": ""
},
"categoryNodeType": "categoryTree",
"angle": {
"multiLangData": "",
"src": "",
"groupId": "",
"width": 0,
"id": "",
"materialId": "",
"height": 0,
"ratio": 0,
"md5": ""
},
"categoryName": "Women Clothing",
"categoryId": "110000033",
"fixedPit": false,
"categoryLanguage": "常規女士服裝"
},
"level": 1,
"name": "NAVIGATE_COMPONENT_1",
"id": 14527813
}
},
"parentId": 0,
"lastUpdateTime": 1704178035000,
"child": {
"contents": [
{
"parentSignId": "_fplm7gsz2",
"materialStatus": true,
"styleType": "FLOOR_COMPONENT",
"cateId": "_6i4jk8fa5",
"title": "FLOOR_COMPONENT_1",
"signId": "_6i4jk8fa5",
"componentKey": "FLOOR_COMPONENT",
"content": [
"_1kdtabjjm"
],
"props": {
"metaData": {
"categoryType": {
"gameType": "",
"hrefType2": "",
"biContentList": "",
"customIds": "",
"routeParams": "",
"goodsIds": "",
"hrefTarget": "",
"hrefType": "noJump",
"ada": "",
"itemPickingPromotion": "",
"hrefTypeTag": "",
"hrefTitle": "",
"adp": "",
"relativeUrl": "",
"internalLink": "",
"longestInternalLinkPrefix": "",
"categoryType": "1",
"adpImgSrc": "",
"selectTypeName": "",
"categoryIds": "",
"isBigImg": true,
"routePath": "",
"internalLinkPrefixes": [
],
"isInternalLink": 1,
"additionalConfig": {
"statusBarTitle": "",
"immersive": "0",
"anchor": "",
"statusBarTitleShow": "0",
"statusBarTitleColor": "black"
},
"mallCodes": "",
"skuTopping": ""
},
"categoryNodeType": "component",
"categoryLanguageCopywritingGroupId": 4048,
"categoryLanguageMaterialId": 86,
"categoryName": "Shop By Category",
"categoryId": "",
"fixedPit": true,
"categoryLanguage": "按類別選購"
},
"level": 2,
"name": "FLOOR_COMPONENT_1",
"id": 14527814
},
"child": [
{
"materialStatus": false,
"parentSignId": "_6i4jk8fa5",
"styleType": "CATEGORY_COMPONENT",
"cateId": "_1kdtabjjm",
"title": "CATEGORY_COMPONENT_1",
"signId": "_1kdtabjjm",
"componentKey": "CATEGORY_COMPONENT",
"props": {
"metaData": {
"fold": 1,
"expand": 1,
"angle": {
"multiLangData": "",
"src": "",
"groupId": "",
"width": 0,
"id": "",
"materialId": "",
"height": 0,
"ratio": 0,
"md5": ""
},
"autoRecommend": true,
"autoRecommendType": "2",
"categoryLanguage": "Women Tops"
},
"level": 3,
"name": "CATEGORY_COMPONENT_1",
"id": 14527815,
"items": [
{
"categoryNodeType": "categoryTree",
"autoRecommendType": "2",
"categoryName": "Women Tops",
"fixedPit": false,
"categoryLanguage": "女士上衣",
"cover": {
"imgId": "35305004",
"src": "https://img.ltwebstatic.com/images3_abc/2023/09/20/a6/16952228118f20a467ebad8212ede6750a27c55164.png",
"tagId": "6000261",
"goodsId": "23126043",
"groupId": "",
"pictureUpdate": true,
"materialId": "",
"target": "https://img.ltwebstatic.com/images3_abc/2023/09/20/a6/16952228118f20a467ebad8212ede6750a27c55164.png",
"itemId": "35305004",
"multiLangData": "",
"width": "300",
"id": "",
"sku": "sz2309083871578768",
"height": "300",
"ratio": 0,
"md5": ""
},
"categoryType": {
"hrefType2": "",
"itemPickingPromotion": "",
"hrefTypeTag": "",
"biContentList": "",
"hrefTitle": "",
"adp": "",
"relativeUrl": "/RecommendSelection/Women-Tops-sc-017175498.html",
"routeParams": "",
"internalLink": "",
"longestInternalLinkPrefix": "",
"categoryType": "1",
"adpImgSrc": "",
"selectTypeName": "",
"categoryIds": "",
"isBigImg": true,
"routePath": "",
"internalLinkPrefixes": [
],
"additionalConfig": {
"statusBarTitle": "",
"immersive": "0",
"anchor": "",
"statusBarTitleShow": "0",
"statusBarTitleColor": "black"
},
"hrefTarget": "017175498",
"hrefType": "itemPicking",
"ada": "",
"skuTopping": ""
},
"angle": {
"multiLangData": "",
"src": "",
"groupId": "",
"width": 0,
"id": "",
"materialId": "",
"height": 0,
"ratio": 0,
"md5": ""
},
"autoRecommend": true,
"_id": "_ihyv7hjo3",
"id": 14527816,
"atificialMap": false,
"categoryId": "110001096",
"showGoodsPic": false,
"AllChannelsCategory": {
"child": [
],
"p": {
"SmallerLeftSpacing": "",
"Showfloortab": "",
"CatBeautyGoodsFlow": "",
"CatSaleGoodsFlow": "",
"FilterNoWhiteImage": "",
"CatAllGoodsFlow": "",
"ShowAllArrow": "",
"RightRankRec": "",
"ShowAll": "",
"CategoryRefresh": "",
"CatEntranceimagestyle": "",
"CatKidsGoodsFlow": "",
"CatWomenGoodsFlow": "",
"CatCurveGoodsFlow": "",
"CatOtherGoodsFlow": "",
"CatMenGoodsFlow": "",
"ShowPolicyNotice": "None",
"LeftTabRank": "",
"ShowGoodsFlow": "",
"CatHomeGoodsFlow": "",
"CatSwimwearGoodsFlow": ""
},
"param": {
"SmallerLeftSpacing": "",
"Showfloortab": "",
"CatBeautyGoodsFlow": "",
"CatSaleGoodsFlow": "",
"FilterNoWhiteImage": "",
"CatAllGoodsFlow": "",
"ShowAllArrow": "",
"RightRankRec": "",
"ShowAll": "",
"CategoryRefresh": "",
"CatEntranceimagestyle": "",
"CatKidsGoodsFlow": "",
"CatWomenGoodsFlow": "",
"CatCurveGoodsFlow": "",
"CatOtherGoodsFlow": "",
"CatMenGoodsFlow": "",
"ShowPolicyNotice": "None",
"LeftTabRank": "",
"ShowGoodsFlow": "",
"CatHomeGoodsFlow": "",
"CatSwimwearGoodsFlow": ""
},
"version": "v4",
"poskey": "AllChannelsCategory",
"posKey": "AllChannelsCategory",
"sceneStr": "AllChannelsCategory"
},
"goods_img": {
"del_flag": 0,
"batch_no": "20240701110000",
"imgId": 29295160,
"rec_mark": "S_86_1009_0|mmd_16075|fs_0.135051_pc1.4.7.1|prs_0.000561_|fcg_1_2_5_6_7_0|pc1.4.7.1_click_0.135051|rkt|gk",
"tagId": "6000261",
"goodsId": "13589855",
"filter_node_id": "017175498",
"goods_id": "13589855",
"target": "https://img.ltwebstatic.com/images3_abc/2023/06/06/1686026910b1f2b8f2157935b6d81a42c92860822a.png",
"itemId": "29295160",
"score": 0.13505122,
"similarScore": "",
"filter_cate_id": "017175498",
"width": "300",
"filter_source_id": "017175498",
"sku": "sw2302019778825888",
"bizTagId": "",
"height": "300"
},
"target": "https://img.ltwebstatic.com/images3_abc/2023/06/06/1686026910b1f2b8f2157935b6d81a42c92860822a.png",
"goodsId": "13589855",
"imgId": 29295160,
"recommendCate": true,
"recMack": "rec_mark 86"
}
]
}
}
]
}
],
"firstLevelId": "256393",
"id": 11943
},
"imgSrc": "https://img.ltwebstatic.com/images3_abc/2023/09/21/31/1695226950b94db75a9c07c66ea987bc4358f5d98b.png"
}
]通常处理电商数据类目多层级，就可以使用递归函数来进行扁平化，这里我们有特定的需求，所以针对上述数组，进行了如下修改；
扁平数据方法：
function flattenData(data) {
let result = [];
function traverse(node, level) {
if (!node) return;
// 复制当前节点的属性，并去除不需要的属性
let nodeCopy = { ...node };
delete nodeCopy.child;
delete nodeCopy.content;
// 添加当前节点到结果数组，记录其层级
result.push({ ...nodeCopy, level });
// 处理 child 节点
if (node.child && node.child.contents) {
node.child.contents.forEach(childNode => traverse(childNode, level + 1)); }
// 处理 child 属性
if (node.child && node.child.length) {
node.child.forEach(item => {
// 处理 props.items 中的子项
if (item.props && item.props.items) {
item.props.items.forEach(subItem => {
let subItemCopy = { ...subItem, level: level + 1 };
result.push(subItemCopy);
});
}
});
}
}
// 对每个顶层节点进行遍历
data.forEach(rootNode => traverse(rootNode, 1)); return result;}
const flattenedData = flattenData(singleArr);
console.log(flattenedData);
