头发还没秃a 2022-09-09 16:17 采纳率: 54.5%
浏览 76
已结题

vue 对一个多级对象数组获取各级名称组合成的字符串

const dataList = [
    {
        id: 1,
        name: “广东省”,
        items: [
            {
                id: 11,
                name: “深圳市”,
                items: [
                    {
                          id: 112,
                          name: “福田区”,
                          items: []
                     },
                ]
            },
        ]
    },
]

以上数据在已知 id = 112 的情况下,如何获取到文本:“广东省 > 深圳市 > 福田区” ?

  • 写回答

2条回答 默认 最新

  • 崽崽的谷雨 2022-09-09 16:31
    关注

    递归 一下 vue里 nodePathArray 需要在 data里定义 。然后在methods里加上 getNodeRoute 调用就是 this.getNodeRoute(xx,xx) 还是有就是 getNodeRoute 里的nodePathArray.push 改成 this.nodePathArray.push

    
    <!DOCTYPE html>
    <html lang="en">
    
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Document</title>
    </head>
    
    <body>
    
    </body>
    <script>
        const dataList = [
            {
                id: 1,
                name: "广东省",
                items: [
                    {
                        id: 11,
                        name: "深圳市",
                        items: [
                            {
                                id: 112,
                                name: "福田区",
                                items: [
                                    {
                                        id: 1121,
                                        name: "福田区666",
                                        items: [
    
                                        ]
                                    },
                                ]
                            },
                        ]
                    },
                ]
            },
        ];
    
        // function lu(data,id){
        //     data.map((item)=>{
    
        //     })
        // }
    
    
    
    
        // 首先我们先定义个数组,用来保存路径节点id
        let nodePathArray = []
    
        // (tree为目标树,targetId为目标节点id)
        function getNodeRoute(tree, targetId) {
            for (let index = 0; index < tree.length; index++) {
                if (tree[index].items) {
                    let endRecursiveLoop = getNodeRoute(tree[index].items, targetId)
                    if (endRecursiveLoop) {
                        nodePathArray.push(tree[index].name)
                        return true
                    }
                }
                if (tree[index].id === targetId) {
                    nodePathArray.push(tree[index].name)
                    return true
                }
            }
        }
    
        getNodeRoute(dataList, 1121) //查找id为112的节点路径
        console.log(nodePathArray.reverse().join('-'));
    
    </script>
    
    </html>
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论 编辑记录
查看更多回答(1条)

报告相同问题?

问题事件

  • 已结题 (查看结题原因) 9月9日
  • 已采纳回答 9月9日
  • 专家修改了标签 9月9日
  • 创建了问题 9月9日

悬赏问题

  • ¥15 r语言神经网络自变量重要性分析
  • ¥15 基于双目测规则物体尺寸
  • ¥15 wegame打不开英雄联盟
  • ¥15 公司的电脑,win10系统自带远程协助,访问家里个人电脑,提示出现内部错误,各种常规的设置都已经尝试,感觉公司对此功能进行了限制(我们是集团公司)
  • ¥15 救!ENVI5.6深度学习初始化模型报错怎么办?
  • ¥30 eclipse开启服务后,网页无法打开
  • ¥30 雷达辐射源信号参考模型
  • ¥15 html+css+js如何实现这样子的效果?
  • ¥15 STM32单片机自主设计
  • ¥15 如何在node.js中或者java中给wav格式的音频编码成sil格式呢