vue-router封裝
使用者是否需要登入
import Vue from 'vue'
import Router from 'vue-router'
Vue.use(Router)
const routes = [{
path: '/',
redirect: '/home'
},
{
path: '/home',
name: 'home',
component: () =>import('./views/Home.vue'),
meta: {
requireAuth: true, // 新增該欄位,表示進入這個路由是需要登入的
},
children: [{
path: '/account_management',
name: 'account_management',
component: () =>import('./views/admin/account_management.vue')
}]
},
{
path: '/login',
name: 'login',
component: () =>
import('./views/login/login.vue')
}
]
const router = new Router({
routes
})
//路由攔截器
router.beforeEach((to, from, next) => {
//根據欄位判斷是否路由過濾
if(to.meta.requireAuth) { // 判斷該路由是否需要登入許可權
if(localStorage.getItem('sid')) { //身份資訊獲取
next();
} else {
next({
path: '/login'
})
}
} else {
next();
}
});
export default router;