ES6从嵌套对象获取属性

我正在做一个VueJS，Lodash和Babel的项目，而我的问题是我需要在我的应用程序中填充一个边栏从routes.js文件。问题是我真的不知道如何检索我需要的数据。ES6从嵌套对象获取属性

export default [ 
    { 
    path: "/admin/login", 
    name: "admin.login", 
    component: Login 
    }, 
    { 
    path: "/admin", 
    component: MasterLayout, 
    meta: { auth: true }, 
    children: [ 
     { 
     path: "/admin/dashboard", 
     alias: "/", 
     menu: { text: "", icon: ""}, 
     name: "admin.dashboard", 
     component: DashboardIndex 
     } 
    ] 
    }, 
    { 
    path: '/403', 
    name: 'error.forbidden', 
    component: ErrorForbidden 
    }, 
    { 
    path: "*", 
    name: 'error.notfound', 
    component: ErrorPageNotFound 
    } 
];

这是我的路线文件，基本上，我需要遍历每个路由，检查是否有孩子或菜单属性，如果它有一个菜单将其添加到我的侧边栏的列表项目，它的孩子得到补充以及与自己菜单特性被撤出

最后我想获得类似下面的

sidebarItems: [ 
{ 
    name: 'Dashboard', 
    icon: 'dashboard', 
    name: 'admin.dashboard' 
}, 
{ 
    name: 'OtherRoute', 
    icon: 'other-route', 
    name: 'admin.other-route', 
    children: [ 
    { 
     name: 'SubRoute', 
     icon: 'sub-route', 
     name: 'admin.sub' 
    } 
    ] 
} 
]

这只应该包含菜单属性的路线。

来源

2017-08-29 João Serra

如何在同一对象可以有2'name'属性？ 'name：'Dashboard''和name：'admin.dashboard'例如 –

@KoushikChatterjee它们是不同的对象，第一个是原始'routes.js'对象，另一个是在运行时从该初始对象生成的另一个对象 –

你基本上需要递归迭代这个数组，所以请尝试这个办法：

function iterateArrayRoutes(routeArray) { 
    if(routeArray instanceof Array) { 
    var routeFormatted = routeArray.reduce(function(last, route){ 
     if (route.hasOwnProperty("menu")) { 
     var item = { 
      name: route.name, 
      icon: route.menu.icon 
     }; 
     if(route.hasOwnProperty("children") && route.children.length > 0) { 
      item.children = iterateArrayRoutes(route.children); 
     } 
     last.push(item); 
     } 
     return last; 
    }, []); 
    return routeFormatted; 
    } 
};

这里有一个演示https://jsfiddle.net/vm1hrwLL/

来源

2017-08-29 05:10:46

ES6从嵌套对象获取属性

回答

相关问题