技術標籤：vue.js

全域性守衛：

需要用過路由物件router進行使用

前置守衛：

在路由發生跳轉時最先觸發的一定時全域性的前置守衛，

後置守衛：

        在路由跳轉進入後執行，執行時機在beforeEnter之後且在Vue的beforeCreate之前

獨享守衛(比較少見)

與其他兩種路由鉤子不同的是它只有一個，而不是一對，需要在路由的routes陣列的對應路由物件中進行配置，執行時機在全域性前置守衛之後

元件內的路由守衛

從名字就可以得知它是存在元件當中的，需要在對應的元件中配置。
在進入元件時觸發beforeRouteEnter(),執行時機在beforeEnter之後,afterEach之後

在元件路由地址添加了引數但沒有跳轉時會觸發

beforeRouteUpdate()，同時在元件複用也會觸發
在離開元件時觸發beforeRouteLeave(),執行時機在離開元件時立即觸發

注意：路由中有next的一定要執行next()才會跳轉到頁面，如果沒有執行next()的話會導致頁面無法跳轉到相應頁面，會出現白屏的情況

路由與Vue鉤子順序

路由發生跳轉
beforeEach—>beforeEnter—>beforeRouteEnter—>afterEach—>beforeCreate—>created—>beforeMount—>mounted–vue的資料發生改變–>beforeUpdate—>Updated–離開當前元件–>beforeRouterLeave—>

不足之處請多多指教