Lodash自动生成树视图

我想为我的反应组件自动生成一个树形视图。 我有自己的path多个文件。 例如：

• COM /公司/模型/ Main.java
• COM /公司/控制器/ Move.java
• COM /公司/控制器/ Rotate.java
• COM /公司/查看/ Watch.java

目标是让对象数据看起来像这样：

var data = { name: com, children: [{name: company, children: [ {name: model, children: [{name: Main.java}] }, {name: controller, children: [{name: Move.java},{name: Rotate.java}] }, {name: view, children: [{name: Watch.java}] } ]}] } 

我发现这个库拆分我的path选项卡： https ： //nodejs.org/api/path.html

喜欢这个 ：

 var path = com/company/model/Main.java ; var dirname = path.dirname(path); // => « com/company/model » var folders = dirname.split(path.sep); // => folders = ['com','compagny','model'] 

我试图使用lodash https://lodash.com/docs要自动生成这个没有成功，你可以帮我

Answer 1

使用这个答案的稍微修改版本：

 var _ = require('lodash'); var path = require('path'); var paths = [ 'com/company/model/Main.java', 'com/company/controller/Move.java', 'com/company/controller/Rotate.java', 'com/company/view/Watch.java' ]; // build input data from the paths // { // "lvl0": "com", // "lvl1": "company", // "lvl2": "model", // "name": "Main.java", // "path": "com/company/model/Main.java" // } var data = paths.map(function (el) { // var folders = path.dirname(el).split(path.sep); var folders = path.dirname(el).split('/'); var obj = {}; for (var i = 0; i < folders.length; i++) { obj['lvl' + i] = folders[i]; } obj.name = path.basename(el); obj.path = el; return obj; }); // add a new function to lodash _.mixin({ groupByMulti: function (obj, values, context) { if (!values.length) return obj; var byFirst = _.groupBy(obj, _.head(values), context); for (var prop in byFirst) { byFirst[prop] = _.groupByMulti(byFirst[prop], _.tail(values), context); } byFirst = _.map(byFirst, function (rows, key) { return { name: key, children: rows }; }); return byFirst; } }); var out = _.groupByMulti(data, ['lvl0', 'lvl1', 'lvl2'])[0]; console.log(JSON.stringify(out, null, 3));