对数组对象递归遍历给子对象添加父对象属性的方法


原始数据如下所示

[
    {
        "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": "互联网"
    }
]

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM