第一步:添加需要攔截的頁面
{ path: '/control', name: 'Control', meta: { requireAuth: true },
第二步:頁面攔截
router.beforeEach((to, from, next) => { if (to.meta.requireAuth) { // 判斷該路由是否需要登錄權限 if (!(Object.keys(store.state.userInfo).length === 0)) { // 通過vuex state獲取當前的token是否存在 iView.LoadingBar.start() next() } else { next({ path: '/login', query: { redirect: to.fullPath } // 將跳轉的路由path作為參數,登錄成功后跳轉到該路由 }) } } else { iView.LoadingBar.start() next() } })
第三步:后台返回攔截
if (res.data.code !== 0) { Message.info(res.data.msg) } if (res.data.code === 401) { router.replace({ path: 'login', query: { redirect: router.currentRoute.path } }) Message.info('已掉線,請重新登錄') }
攔截全部做完,祝你好運!!!
{
path:
'/control',
name:
'Control',
meta: {
requireAuth:
true
},