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

 

輸出結果：