• JS递归,根据id找寻父级的id集合


    公司项目开发中遇到的实际需求

    1.后端返回的城市树状数据格式

     附上数据格式源码:

    const city=[
        {
            companyId: 1,
            id: "1",
            label: "四川省",
            parentId: "",
            value: "1",
            children:[
                {
                    companyId: 1,
                    id: "2",
                    label: "成都市",
                    parentId: "1",
                    value: "2",
                    children:[
                        {
                            companyId: 1,
                            id: "3",
                            label: "高新区",
                            parentId: "2",
                            value: "3",
                            children:[
                                {
                                    companyId: 1,
                                    id: "4",
                                    label: "环球中心",
                                    parentId: "3",
                                    value: "4"
                                }
                            ]
                        }
                    ]
                }
            ]
        }
    ]
    

      由于公司项目是vue项目,所以我直接写成了单独JS文件:

        

    具体使用如下:1.在utils下建立cityQueryParent.js文件

             2.cityQueryParent.js里的代码如下:

     附上代码:

    export function getParentIdList(list, id) {
        if (!list || !id) {
            return ''
        }
        let arr = [];
        let findParent = (data, nodeId, parentId) => {
            for (var i = 0, length = data.length; i < length; i++) {
                let node = data[i];
                //由于后端返回的树状结构数组里面的value值为string类型,所以为了避免判断全等有问题,所以将传入的城市id使用toString进行了类型转换
                if (node.value === nodeId.toString()) {
                    arr.unshift(nodeId.toString());
                    if (nodeId.toString() === list[0].value) {
                        break
                    }
                    findParent(list, parentId);
                    break
                } else {
                    if (node.children) {
                        findParent(node.children, nodeId, node.value);
                    }
                    continue
                }
            }
            return arr;
        }
        return findParent(list, id);
    }
    

      3.页面使用:

        import * as util2 from "@/utils/cityQueryParent";
        

     使用示例:

      id传入为3

    输出结果:

  • 相关阅读:
    webpack学习_管理输出(管理资源插件)
    vue路由
    vue动态组件,组件缓存
    vue组件间传参
    模块化
    安装Vue脚手架,创建Vue项目
    Vue常用指令
    VUE概述
    小程序调用微信支付接口
    Android音视频开发之-WebRTC技术实践
  • 原文地址:https://www.cnblogs.com/youwei716/p/14516716.html
Copyright © 2020-2023  润新知