原始數據如下所示
[ { "name": "互聯網", "label": "互聯網", "value": "互聯網", "children": [ { "name": "電商", "label": "電商", "value": "電商", "children": [ { "name": "天貓", "label": "天貓", "value": "天貓" }, { "name": "拼多多", "label": "拼多多", "value": "拼多多" }, { "name": "亞馬遜", "label": "亞馬遜", "value": "亞馬遜" }, ] }, { "name": "汽車美容", "label": "汽車美容", "value": "汽車美容" }, { "name": "個人服務", "label": "個人服務", "value": "個人服務" }, { "name": "醫療衛生", "label": "醫療衛生", "value": "醫療衛生" } ] } ]
先需要給所有children里面的label加上父級label作為前綴【效果:互聯網-電商-天貓】
實現代碼如下
let respData:any[] = resp.data.content function recursionList(data, line='') { data.map((item:any) => { item.name = item.tag.name item.label = `${line ? line + '-' : ''}${item.tag.name}` item.value = `${line ? line + '-' : ''}${item.tag.name}` if(item.children && item.children instanceof Array && item.children.length){ let nameLine = `${line ? line + '-' : ''}${item.tag.name}` recursionList(item.children, nameLine) } }) } recursionList(respData)
處理后結果:
[ { "name": "互聯網", "label": "互聯網", "value": "互聯網", "children": [ { "name": "電商", "label": "電商", "value": "電商", "children": [ { "name": "天貓", "label": "天貓", "value": "天貓", "otherLabel": "互聯網-電商-天貓" }, { "name": "拼多多", "label": "拼多多", "value": "拼多多", "otherLabel": "互聯網-電商-拼多多" }, { "name": "亞馬遜", "label": "亞馬遜", "value": "亞馬遜", "otherLabel": "互聯網-電商-亞馬遜" } ], "otherLabel": "互聯網-電商" }, { "name": "汽車美容", "label": "汽車美容", "value": "汽車美容", "otherLabel": "互聯網-汽車美容" }, { "name": "個人服務", "label": "個人服務", "value": "個人服務", "otherLabel": "互聯網-個人服務" }, { "name": "醫療衛生", "label": "醫療衛生", "value": "醫療衛生", "otherLabel": "互聯網-醫療衛生" } ], "otherLabel": "互聯網" } ]