獨(dú)享路由守衛(wèi)
- 獨(dú)享路由守衛(wèi)只有前置守衛(wèi),沒(méi)有后置守衛(wèi)
- 各類(lèi)守衛(wèi)間可配合交叉使用
作用:某一個(gè)路由獨(dú)享的對(duì)路由跳轉(zhuǎn)、切換進(jìn)行控制
-
實(shí)現(xiàn):
- 其使用方式與全局前置路由守衛(wèi)相似,只是其調(diào)用的API為
beforeEnter - 將該API寫(xiě)在所需的路由的項(xiàng)中
{ name: 'NEws', path: 'news', component: News, meta:{isAuth:true,title:'新聞'}, beforeEnter:(to, from, next)=>{ if (to.meta.isAuth){ if (localStorage.getItem('name')==='test'){ next() } }else { next() } } } - 其使用方式與全局前置路由守衛(wèi)相似,只是其調(diào)用的API為
組件內(nèi)路由守衛(wèi)
- 在組件內(nèi)設(shè)置其專(zhuān)有路由規(guī)則時(shí)使用
-
beforeRouteEnter(進(jìn)入守衛(wèi)):通過(guò)路由規(guī)則進(jìn)入該組件時(shí)調(diào)用 -
beforeRouteLeave(離開(kāi)守衛(wèi)):通過(guò)路由規(guī)則離開(kāi)該組件時(shí)調(diào)用
beforeRouteEnter(to,from,next){},
beforeRouteLeave(to,from,next){
next()
},