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']
        }
      }
    ]
  },

    使用者登入的時候，會判斷使用者所屬的角色，但是我也沒找到，使用者登入後是怎麼判斷當前使用者所屬角色的，

再看看吧