无法重新组合阵列



我在Angular上做了一个简单的资源管理器(有一个包含其他目录或文本文件的目录列表(。问题是:我从服务器收到以下数据("路径"是文件夹的路径,父目录的ID(:

[
{
id: "6np5E3yyEISXLNX9muyt",
name: "sec list",
path: ["", "GnBOclNO1v3n9FW7aGv0", "X5YNJ6Vco2BtGxNZVsYV"],
}, 
{
id: "GnBOclNO1v3n9FW7aGv0",
name: "In aeroport",
path: [""],
},
{
id: "H6AvpwXc49v4oDRWSjym",
name: "Delete",
path: [""],
},
{
id: "LQ73vVoTuw9xd40jMs3j",
name: "Aeroport list",
path: [""],
},
{
id: "X5YNJ6Vco2BtGxNZVsYV",
name: "Bordery words",
path: ["", "GnBOclNO1v3n9FW7aGv0"],
},
{
id: "jWeClRAw55Er8z0Ow9uq",
name: "mail list",
path: ["", "GnBOclNO1v3n9FW7aGv0", "X5YNJ6Vco2BtGxNZVsYV"],
}
];

如何将其重新组合为下面的代码?我知道递归是必要的,但我不明白,如何做对。请帮帮我。

[
{
id: "GnBOclNO1v3n9FW7aGv0",
name: "In aeroport",
children: [
{
id: "X5YNJ6Vco2BtGxNZVsYV",
name: "Bordery words",
children: [
{
id: "6np5E3yyEISXLNX9muyt",
name: "sec list",
},
{
id: "jWeClRAw55Er8z0Ow9uq",
name: "mail list",
}
],
}
],
},
{
id: "H6AvpwXc49v4oDRWSjym",
name: "Delete",
},
{
id: "LQ73vVoTuw9xd40jMs3j",
name: "Aeroport list",
},
]

简单的DFS解决了这个问题,但有多种方法可以做到这一点。一种方式低于

var paths = [
{
id: "6np5E3yyEISXLNX9muyt",
name: "sec list",
path: ["", "GnBOclNO1v3n9FW7aGv0", "X5YNJ6Vco2BtGxNZVsYV"],
}, 
{
id: "GnBOclNO1v3n9FW7aGv0",
name: "In aeroport",
path: [""],
},
{
id: "H6AvpwXc49v4oDRWSjym",
name: "Delete",
path: [""],
},
{
id: "LQ73vVoTuw9xd40jMs3j",
name: "Aeroport list",
path: [""],
},
{
id: "X5YNJ6Vco2BtGxNZVsYV",
name: "Bordery words",
path: ["", "GnBOclNO1v3n9FW7aGv0"],
},
{
id: "jWeClRAw55Er8z0Ow9uq",
name: "mail list",
path: ["", "GnBOclNO1v3n9FW7aGv0", "X5YNJ6Vco2BtGxNZVsYV"],
}
];

var dfs = function( parentJson , path){
for(var i=0;i<paths.length;i++){
if(paths[i].path.join("") == path ){
var child = {id:paths[i].id,name:paths[i].name,children:[]}
parentJson.push(child)
dfs(child.children,path+paths[i].id)
}
}

}
var json = [];
dfs(json,"")
console.log(json)

您可以分两个阶段完成:

首先制作一个嵌套的对象结构,其中children属性不是数组,而是对象,其中对象键是id值。这样,您就可以在给定路径的结构中快速导航,并同时扩展/深化它。

在最后阶段,您可以使用递归遍历该树结构,将这些children属性转换为数组。

以下是它的样子:

function makeTree(data) {
// drill down the object structure, where children properties 
// are nested objects with id values as keys.
let result = {}; // root of the tree data structure
for (let {id, name, path} of data) {
Object.assign(path.slice(1).concat(id).reduce((acc, key) => {
if (!acc.children) acc.children = {};
if (!acc.children[key]) acc.children[key] = {};
return acc.children[key];
}, result), { id, name });
}
return (function unkey(node) {
// Convert children objects to arrays
if (node.children) node.children = Object.values(node.children).map(unkey);
return node;
})(result);
}
let data = [{id: "6np5E3yyEISXLNX9muyt",name: "sec list",path: ["", "GnBOclNO1v3n9FW7aGv0", "X5YNJ6Vco2BtGxNZVsYV"],},{id: "GnBOclNO1v3n9FW7aGv0",name: "In aeroport",path: [""],},{id: "H6AvpwXc49v4oDRWSjym",name: "Delete",path: [""],},{id: "LQ73vVoTuw9xd40jMs3j",name: "Aeroport list",path: [""],},{id: "X5YNJ6Vco2BtGxNZVsYV",name: "Bordery words",path: ["", "GnBOclNO1v3n9FW7aGv0"],},{id: "jWeClRAw55Er8z0Ow9uq",name: "mail list",path: ["", "GnBOclNO1v3n9FW7aGv0", "X5YNJ6Vco2BtGxNZVsYV"],}];
console.log(makeTree(data));

注意,从未使用path值的第一个值。它似乎总是空字符串。

最新更新