導航守衛 一、全局導航守衛 1. 全局導航守衛,把方法給 router,只要路由發生改變跳轉都會觸發這個函數 2. 每個路由 都有一個 meta 3. 全局導航守衛分兩種: 1. 全局前置導航守衛:路由還沒有跳轉之前 2. 全局後置導航守衛:路由跳轉之後 3. to 和 from 都是 router ...
導航守衛
一、全局導航守衛
1. 全局導航守衛,把方法給 router,只要路由發生改變跳轉都會觸發這個函數
2. 每個路由 都有一個 meta
3. 全局導航守衛分兩種:
1. 全局前置導航守衛:路由還沒有跳轉之前
2. 全局後置導航守衛:路由跳轉之後
3. to 和 from 都是 router
3.1 to 即將跳轉的路由
3.2 from 跳轉之後的路由
4. next 函數 必須調用,不寫所有的 路由 就沒法跳轉
4. 全局前置導航守衛:路由跳轉前 執行這個方法
router.beforeEach ((to, from, next)=> {
next()
})
5. 全局後置導航守衛:路由跳轉後會執行這個方法,它沒有 next函數。路由跳轉之後會執行這個方法
router.afterEach ((to, from) => {
console.log("路由跳轉後")
})
二、路由獨享守衛
1. 某個路由獨有的 其它路由沒有,只有進入某個路由,才會觸發這個路由方法
三、組件類的守衛
一、 beforeRouteEnter
2. 當該組件對應的 路由被渲染時 會執行這個函數
註意:這個函數不能使用this關鍵字,因為組件化還沒有實例
二、beforeRouteUpdate
1. 在當前路由發生改變且該組件被覆用的時候
2. 這種現象只能發生在路由傳參上,只有路由傳參才會出現路由不同,組件被覆用
三、beforeRouteLeave
導航離開該組件對應的路由 會執行這個函數
作者:晉飛翔
手機號(微信同步):17812718961
希望本篇文章 能給正在學習 前端的朋友 或 以及工作的朋友 帶來收穫 不喜勿噴 如有建議 多多提議 謝謝!!!