vue后台管理系统学习(6)--路由和权限

 1. 路由配置

 vue-element-admin 后台的所有路由都是在src/router/index.js 这个文件中进行配置。

路由分为两种constantRoutes和asyncRoutes

 constantRoutes 中的路由不需要权限就可以访问到,如登录页面，404页面

 asyncRoutes    中的路由需要权限才能访问

 所有的路由使用的都是懒加载

2  权限判断

   路由访问权限都是通过角色来控制的。通过设置路由meta下面的roles给路由设置访问角色，如下

   系统总默认定义了两个角色 'admin', 'editor'

   

{
    path: '/permission',
    component: Layout,
    redirect: '/permission/page',
    alwaysShow: true, // will always show the root menu
    name: 'Permission',
    meta: {
      title: 'permission',
      icon: 'lock',
      roles: ['admin', 'editor'] // you can set roles in root nav
    },
    children: [
      {
        path: 'page',
        component: () => import('@/views/permission/page'),
        name: 'PagePermission',
        meta: {
          title: 'pagePermission',
          roles: ['admin'] // or you can only set roles in sub nav
        }
      },
      {
        path: 'directive',
        component: () => import('@/views/permission/directive'),
        name: 'DirectivePermission',
        meta: {
          title: 'directivePermission'
          // if do not set roles, means: this page does not require permission
        }
      },
      {
        path: 'role',
        component: () => import('@/views/permission/role'),
        name: 'RolePermission',
        meta: {
          title: 'rolePermission',
          roles: ['admin']
        }
      }
    ]
  },

    用户登录的时候，会判断用户所属的角色，但是我也没找到，用户登录后是怎么判断当前用户所属角色的，

再看看吧