码迷,mamicode.com
首页 > 其他好文 > 详细

vue-element-template实战(五) 获取后端路由表动态生成权限

时间:2020-06-26 16:43:49      阅读:177      评论:0      收藏:0      [点我收藏+]

标签:imp   获取   用户信息   2-2   渲染   nes   后端   返回   token   

主要思路如下:

  • 用户登录login获取token
  • 拿着token请求用户信息,同时后端返回一个路由表
  • 前端解析后动态添加路由表,同时存储到本地localstorage
  • 刷新页面或者退出登录或者登录过期等时,会进行相应的判断,重新渲染路由

1、在src/router文件夹下新建_import.js,用于匹配组件,代码如下:

export default file => {
    return map[file] || null
  }
  const map = {
    ‘Layout‘: () => import(‘@/layout‘),
    ‘table‘: () => import(‘@/views/table/index‘),
    ‘tree‘: () => import(‘@/views/tree/index‘),
    ‘form‘: () => import(‘@/views/form/index‘),
    ‘menu1‘: () => import(‘@/views/nested/menu1/index‘),
    ‘menu1-1‘: () => import(‘@/views/nested/menu1/menu1-1‘),
    ‘menu1-2‘: () => import(‘@/views/nested/menu1/menu1-2‘),
    ‘menu1-2-1‘: () => import(‘@/views/nested/menu1/menu1-2/menu1-2-1‘),
    ‘menu1-2-2‘: () => import(‘@/views/nested/menu1/menu1-2/menu1-2-2‘),
    ‘menu1-3‘: () => import(‘@/views/nested/menu1/menu1-3‘),
    ‘menu2‘: () => import(‘@/views/nested/menu2/index‘)
  }
  

 

vue-element-template实战(五) 获取后端路由表动态生成权限

标签:imp   获取   用户信息   2-2   渲染   nes   后端   返回   token   

原文地址:https://www.cnblogs.com/windok/p/13195268.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!