原项目菜单嵌套对应的路由嵌套
但实际项目中路由只有两级,菜单有三级,
第二级路由的功能要实现分组或子分类的功能,在菜单中实现三级
实现思路:
在上一篇中实现从服务器端动态得到路由后src/store/modules/permission.js文件中判断实际vue组件是否存在,如果存在则生成路由,存入到src/store/index.js getters routers: state => state.permission.routers 中备用
动态获取的路由,带一参数groupName,如果此参数相同,则代表要生成三级菜单
然后在src/views/layout/Sidebar 生成菜单时,从state.permission.routers中获取路由,判断groupName是否相同,生成新的三级数组,供菜单生成使用
二级路由生成三级菜单代码如下:
newmenu: function () {
//let newmenuarray = []
//将二级路由 分隔,然后二级中有分组的合并为三级,供菜单 使用
let newmenuarray = this.$store.getters.store_all_routers;
newmenuarray.map(function (itemmenu, itemIndex) {
let menu_temp_child_noGroup = []//无分组
let menu_temp_child_useGroup = []//有分组
if (itemmenu.children && itemmenu.children != '') {
itemmenu.children.map(function (childmenu, childIndex)