在組件中使用路由守衛(wèi);
beforeRouteEnter (to, from, next) {
// 注意县貌,在路由進(jìn)入之前术陶,組件實(shí)例還未渲染,所以無法獲取this實(shí)例煤痕,只能通過vm來訪問組件實(shí)例
if(userData.status == 0){//userData為接口返回?cái)?shù)據(jù)梧宫。
next(vm => {
vm.$message.warning({
showClose: true,
message: '不符合條件'
});
vm.$router.replace(from.path);//返回之前頁面
})
}else{
next(vm => {})
}
},
組件內(nèi)的幾個路由守衛(wèi)使用時機(jī)
beforeRouteEnter (to, from, next) {
// 在渲染該組件的對應(yīng)路由被 confirm 前調(diào)用
// 不!能摆碉!獲取組件實(shí)例 `this`
// 因?yàn)楫?dāng)守衛(wèi)執(zhí)行前塘匣,組件實(shí)例還沒被創(chuàng)建
next(vm => {
// 通過 `vm` 訪問組件實(shí)例
})
},
beforeRouteUpdate (to, from, next) {
// 在當(dāng)前路由改變,但是該組件被復(fù)用時調(diào)用
// 舉例來說巷帝,對于一個帶有動態(tài)參數(shù)的路徑 /foo/:id忌卤,在 /foo/1 和 /foo/2 之間跳轉(zhuǎn)的時候,
// 由于會渲染同樣的 Foo 組件楞泼,因此組件實(shí)例會被復(fù)用驰徊。而這個鉤子就會在這個情況下被調(diào)用。
// 可以訪問組件實(shí)例 `this`
},
beforeRouteLeave (to, from, next) {
// 導(dǎo)航離開該組件的對應(yīng)路由時調(diào)用
// 可以訪問組件實(shí)例 `this`
}