在纯Javascript中从Url生成Treeview

我得到了如下数组形式的文件Url

我想实现这样一个目标

var mainObj = [
{
    name: "Home",
    files: ["excel doc 1.xlsx", "excel doc 2.xlsx"],
    folders: [{
        name: "Procedure",
        files: ["excel doc 2.xlsx"],
        folders: []
    }],
},
{
    name: "BusinessUnits",
    files: [],
    folders:[
        {
            name:"Administration",
            files:[],
            folders:[{
                name: "AlKhorDocument",
                files: [],
                folders:[
                    {
                        name: "Album1",
                        files: [],
                        folders:[......]
                    }
                ]
            }]
        }
    ]
}

]

。。。。。。。 如果你能帮忙，请告诉我

顺便说一句，我想实现如下目标

如果您能提出更好的建议，那么它将对我有所帮助。

您需要执行一些字符串解析，将URL字符串拆分为不同的部分，收集创建树状结构所需的所有信息

基本上，您可以将所有URL字符串拆分为各个部分，并通过分析URL字符串的所有子部分来创建最终的数据结构

让URL=[
'http://host.com/Performance/excel 文件1.xlsx'，
'http://host.com/BusinessUnits/Administration/AlKhorDocument/Album1/...',
// ...
];
让结果=[]；
forEach（url=>{
让relevantUrl=url.replace（'http://host.com/“，”；//删除不必要的主机名
让sections=relevantUrl.split（“/”）；//从URL获取所有字符串节
sections.forEach（section=>{
//检查内部对象是否已经存在
让innerObject=result.find（obj=>obj.name==section）；
如果（！innerObject）{
//为截面创建内部对象
innerObject={
名称：科室，
文件：[]，
文件夹：[]
};
}
//将当前URL节（作为对象）添加到结果中
result.push（innerObject）；
});
});

---

您仍然需要处理的是保存节对象的当前子级别，您可以这样做。

通过仅包含字符串的路径部分，您可以通过减少文件夹结构来减少数组，并将最终文件添加到文件夹结构中

var data=['Home/excel doc 1.xlsx'，'Home/excel doc 2.xlsx'，'Home/Procedure/excel doc'，'Home/Procedure/2.xlsx'，'BusinessUnits/Administration/AlKhorDocument/Album1/text.txt']，
结果=数据。减少（（r，p）=>{
var path=p.split（'/'），
file=path.pop（），
final=path.reduce（（o，name）=>{
var temp=（o.folders=o.folders | |[]）.find（q=>q.name==name）；
if（！temp）o.folders.push（temp={name}）；
返回温度；
}，r）；
（final.files=final.files | |[]）.push（文件）；
返回r；
}, {});
控制台日志（结果）
。作为控制台包装{最大高度：100%！重要；顶部：0；}
谢谢。你救了我的命。它非常有效：）：）是的。我试了很多。。无法与大家分享，因为我花了大约3天的时间来实现这一点。