iview-admin 三级菜单路由嵌套

刘明发布于2019-08-22 15:09 / 1404人阅读

摘要：使用，框架是二级菜单，因业务需要改成三级菜单。系统配置用户配置管理员部门信息工单配置出现了，请写，问题重现了问题也就解决啦。

使用iview-admin，框架是二级菜单，因业务需要改成三级菜单。其他部分都已经改好，但是页面仍然没有出来，页面也没有了报错，比较诡异。
后来发现问题可能在路由配置，看到了别人写的这个demo，链接：https://jsfiddle.net/767nb8u1/1/
可以看到，嵌套组件中的每一级都有component选项，好像是必须的（页面也没有了报错），chidren选项中的component父子两级同时渲染，这肯定不是我们所需要的，知乎有人这样解决的：

增加了中间层：artical-publish-center.vue
内容如下：

做中间层，将最终的路由转接过去。这样就轻松的处理了这个问题。以下是我的路由配置项。

    {
        path: "/form",
        icon: "settings",
        name: "form",
        title: "系统配置",
        component: Main,
        children: [
            {   path: "artical-publish",
                title: "用户配置",
                name: "artical-publish",
                icon: "compose",
                component: () => import("@/views/form/article-publish/artical-publish-center.vue"),
                children:[
                    {   path: "artical-publish-sub",
                        title: "管理员",
                        name: "artical-publish-sub",
                        icon: "person",
                        component: () => import("@/views/tables/exportable-table-JD.vue")
                    },
                    {   path: "partInfo",
                        title: "部门信息",
                        name: "partInfo",
                        icon: "person-stalker",
                        component: () => import("@/views/form/work-flow/work-flow.vue")
                    }
                ]},
        {   path: "",
            title: "工单配置",
            name: "Worksheet",
            icon: "wrench",
            component: () => import("@/views/form/work-flow/work-flow.vue")
        }
        ]
    },

出现了bug，请写bug demo，问题重现了？！？问题也就解决啦。^_^

GPU云服务器云服务器三级导航菜单三级联动菜单三级竖向菜单路由嵌套

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/93208.html

Vue iview-admin框架二级菜单改为三级菜单

摘要：最近在用的后台模板，从上下载后发现左侧导航栏最多支持到二级菜单也发现很多童鞋在问如何实现三级菜单。在实际的应用场景中还是会出现三级菜单的需求的，木有其他好办法，只能自己手动改代码了。最近在用 iview-admin的Vue后台模板，从git上下载后发现左侧导航栏最多支持到二级菜单,也发现很多童鞋在问如何实现三级菜单。在实际的应用场景中还是会出现三级菜单的需求的，木有其他好办法，只能自...

codeKK 2019-08-22 18:28 评论0 收藏0
iview-admin 关于权限控制

摘要：权限控制也就是用户只能访问被分配的资源。在前端展示上也笼统的分为菜单权限控制和页面中按钮权限控制。菜单是路由的直接体现，菜单控制实际上就是路由控制。系统中解决权限方案参照权限控制也就是用户只能访问被分配的资源。在前端展示上也笼统的分为菜单权限控制和页面中按钮权限控制。 1.菜单是路由的直接体现，菜单控制实际上就是路由控制。在路由的before 钩子函数中校验当前访问的地址是否有权访问...

spademan 2019-08-22 15:12 评论0 收藏0
关于前后端分离权限控制，元素细粒度（iview-admin实现）

摘要：按钮方面按钮通过自定义指令绑定其特定的操作接口信息如产品上传按钮，需要拥有产品上传的信息，才可以继续执行按钮的业务逻辑。开篇啰嗦几句在传统单体项目中，通常会有一些框架用来管理熟知的权限。如耳濡目染的 Shiro 或者 Spring Security 。然而，到了现在这个时代，新开始的项目会更多的才用后端微服务 + 前端 mvvm 的架构开始书写项目。权限控制方面将变得有些许晦涩。当...

YorkChen 2019-08-23 15:39 评论0 收藏0
Element做管理系统时 2、3级路由切换时，界面数据不缓存问题

摘要：解决方案方法一适用范围，菜单列表是通过接口返回的。菜单列表不是接口返回的，接口只返回访问菜单的权限，大体意思就是统一把路由写成三级形式。我比较赞成菜单权限列表一律放在后台做这样做风险远比在前端处理的要小。解决方案方法一：适用范围，菜单列表是通过接口返回的。PS：只要通过接口返回的菜单列表就意味着用户是可以访问的，权限处理一律放在后台做，但写本地路由时不论是二级界面还是三级界面，配...

wuyangchun 2019-08-23 14:17 评论0 收藏0