#在切換路由時，組件會被復(fù)用，不過，這也意味著組件的生命周期鉤子不會再被調(diào)用。

　　　解決辦法有兩種，1簡單地 watch (監(jiān)測變化) $route 對象：

const User = { template: '...', watch: {  '$route' (to, from) {   // 對路由變化作出響應(yīng)...  } }}

　　　　2.使用 2.2 中引入的 beforeRouteUpdate 導(dǎo)航守衛(wèi)：

const User = { template: '...', beforeRouteUpdate (to, from, next) {  // react to route changes...  // don't forget to call next() }}

#全局守衛(wèi)

你可以使用 router.beforeEach 注冊一個全局前置守衛(wèi)：

const router = new VueRouter({ ... })router.beforeEach((to, from, next) => { // ...})

•to: Route: 即將要進入的目標(biāo) 路由對象

•from: Route: 當(dāng)前導(dǎo)航正要離開的路由

•next: Function: 一定要調(diào)用該方法來 resolve 這個鉤子

#全局解析守衛(wèi)

在 2.5.0+ 你可以用 router.beforeResolve 注冊一個全局守衛(wèi)。這和 router.beforeEach 類似，區(qū)別是在導(dǎo)航被確認(rèn)之前，同時在所有組件內(nèi)守衛(wèi)和異步路由組件被解析之后，解析守衛(wèi)就被調(diào)用。

#全局后置鉤子

你也可以注冊全局后置鉤子，然而和守衛(wèi)不同的是，這些鉤子不會接受 next 函數(shù)也不會改變導(dǎo)航本身：

router.afterEach((to, from) => { // ...})

#路由獨享的守衛(wèi)

你可以在路由配置上直接定義 beforeEnter 守衛(wèi)

const router = new VueRouter({ routes: [  {   path: '/foo',   component: Foo,   beforeEnter: (to, from, next) => {    // ...   }  } ]})

這些守衛(wèi)與全局前置守衛(wèi)的方法參數(shù)是一樣的。

#組件內(nèi)的守衛(wèi)

你可以在路由組件內(nèi)直接定義以下路由導(dǎo)航守衛(wèi)：

const Foo = { template: `...`, beforeRouteEnter (to, from, next) {  // 在渲染該組件的對應(yīng)路由被 confirm 前調(diào)用  // 不！能！獲取組件實例 `this`  // 因為當(dāng)守衛(wèi)執(zhí)行前，組件實例還沒被創(chuàng)建 }, beforeRouteUpdate (to, from, next) {  // 在當(dāng)前路由改變，但是該組件被復(fù)用時調(diào)用  // 舉例來說，對于一個帶有動態(tài)參數(shù)的路徑 /foo/:id，在 /foo/1 和 /foo/2 之間跳轉(zhuǎn)的時候，  // 由于會渲染同樣的 Foo 組件，因此組件實例會被復(fù)用。而這個鉤子就會在這個情況下被調(diào)用。  // 可以訪問組件實例 `this` }, beforeRouteLeave (to, from, next) {  // 導(dǎo)航離開該組件的對應(yīng)路由時調(diào)用  // 可以訪問組件實例 `this` }}

beforeRouteEnter 守衛(wèi) 不能 訪問 this，因為守衛(wèi)在導(dǎo)航確認(rèn)前被調(diào)用,因此即將登場的新組件還沒被創(chuàng)建。

不過，你可以通過傳一個回調(diào)給 next來訪問組件實例。在導(dǎo)航被確認(rèn)的時候執(zhí)行回調(diào)，并且把組件實例作為回調(diào)方法的參數(shù)。