vue項目開發(fā)中經(jīng)常需要對路由進行權限控制饥脑,比如只有登錄才能訪問某個路由
這里分享一個簡單是路由登錄權限設置 廢話不多說,直接上代碼
const router = new Router({
routes: [
{
path: 'recharge',
name: 'recharge',
meta: { // 在路由配置中加入meta:{requireAuth: true}
requireAuth: true
},
component:recharge
}
]
})
// 導航守衛(wèi)
router.beforeEach((to, from, next) => {
if (to.meta.requireAuth) { // 判斷該路由是否需要登錄權限
if (store.state.login) { // 通過vuex state獲取當前登錄狀態(tài)
next()
} else {
next(
// 將跳轉的路由path作為參數(shù)晴圾,登錄成功后跳轉到該路由
{path: '/login',query: {}}
)
}
} else { //如果不需要正常跳轉
next()
}
})