文档章节

双循环递归匹配路由表

o
 osc_x4h57ch8
发布于 2018/04/24 10:54
字数 401
阅读 0
收藏 0

精选30+云产品,助力企业轻松上云!>>>

/**
*根据后端返回数据要求,导航栏权限返回的是要展示的所以信息,所以我们只能根据返回的对象去匹配我们的路由表,把没有返回的项再路由表里剔除,然后重新生成路由表
*/
// 此处数据皆为模拟操作,真是数据请结合实际情况获取
data: {
    route: [  // 我们定义好的路由表
        {path:"/",name:"a",hidden:true},
        {path:"/b",name:"b",hidden:true,children:[
            {path:"/b_1",name:"b_1",hidden:true},
            {path:"/b_2",name:"b_2",hidden:true},
        ]},
        {path:"/c",name:"c",hidden:true,children:[
            {path:"/c_1",name:"c_1",hidden:true},
            {path:"/c_2",name:"c_2",hidden:true},
            {path:"/c_3",name:"c_3",hidden:true},
        ]},
        {path:"/d",name:"d",hidden:true},
    ],
    permisRoute: [ // 后端返回的路由表权限
        {name:"a"},
        {name:"b",permission:[
            {name:"b_1"},
        ]},
        {name:"c",permission:[
            {name:"c_1"},
            {name:"c_2"},
        ]},
    ]
},
methods: {
    /**
     * [此处方法应写store里,然后再在beforeEach里去动态添加路由,vue2.0提供了addRoutes方法
     * @param  {[type]} route       [router里面自己定义好的路由表]
     * @param  {[type]} permisRoute [后台返回路由表权限]
     * @return {[type]}             [生成新的路由表]
     */    
     filterRoute: function(route,permisRoute) {
        for(let item of permisRoute){
            const name = item.name;
            for(let item of route){
                // 修改hidden,匹配路由表
                if(item.name == name){
                    item.hidden = false;
                    break;
                }
            }
            if(item.permission){
                const permisRouteChild = item.permission;
                const routeChild = route.filter(itme => {
                    return itme.name == name;
                })
                // 递归路由表
                this.filterRoute(routeChild[0].children,permisRouteChild)
            }
        }
        return route
    },
   filtersHidden: function (arr) { // 上一步只是把里面hidden变成true,把filterRoute返回结果传入此函数可以过滤掉hidden为true的对象
    const accessedRouters = arr.filter(route => {
      if(!route.hidden){
        if (route.children && route.children.length) {
          route.children = this.filtersa(route.children)
        }
        return true
      }
    })
    return accessedRouters
  },
}

 逻辑可能有点复杂,如果有更好的方法请指教

上一篇: BZOJ4671: 异或图
下一篇: ssh免密登录
o
粉丝 0
博文 500
码字总数 0
作品 0
私信 提问
加载中
请先登录后再评论。

暂无文章

linux下java环境搭建

1、jdk下载: 官方地址:https://www.oracle.com/java/technologies/javase/javase-jdk8-downloads.html 如下图所示,我这边选择的是红框中的版本 2、压缩包上传至服务器 将下载的压缩包上传...

wc_飞豆
今天
17
0
面试题:Java对象不再使用时,为什么要赋值为null?

前言 许多Java开发者都曾听说过“不使用的对象应手动赋值为null“这句话,而且好多开发者一直信奉着这句话;问其原因,大都是回答“有利于GC更早回收内存,减少内存占用”,但再往深入问就回...

码农突围
今天
22
0
设计模式(5) 原型模式

原型模式 原型模式的适用场景 浅拷贝 深拷贝 用Initialize方法修改初始化状态 原型模式与之前学习的各种工厂方法、单例模式、建造者模式最大、最直观的区别在于,它是从一个既有的对象“克隆...

zhixin9001
今天
7
0
获取免费的pycharm激活码网站

http://www.lookdiv.com/

云烟成雨forever
今天
27
0
用Helm部署Kubernetes应用,支持多环境部署与版本回滚

1 前言 Helm是优秀的基于Kubernetes的包管理器。利用Helm,可以快速安装常用的Kubernetes应用,可以针对同一个应用快速部署多套环境,还可以实现运维人员与开发人员的职责分离。现在让我们安...

南瓜慢说
今天
25
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部