詳解Vue路由鉤子及應用場景(小結)-創新互聯
一. 路由鉤子語法
在vue-router的官方文檔中, 將路由鉤子翻譯為導航守衛, 下面是文檔中的內容摘要, 大家也可以通過傳送門前往官網閱讀詳細內容
路由鉤子
路由鉤子主要是給使用者在路由發生變化時進行一些特殊的處理而定義的,靠。。好拗口啊。
總體來講vue里面提供了三大類鉤子
1、全局鉤子
2、某個路由獨享的鉤子
3、組件內鉤子
三種路由鉤子中都涉及到了三個參數,這里直接上官方介紹吧
to: Route: 即將要進入的目標 路由對象
from: Route: 當前導航正要離開的路由
next: Function: 一定要調用該方法來 resolve 這個鉤子。執行效果依賴 next 方法的調用參數。
next(): 進行管道中的下一個鉤子。如果全部鉤子執行完了,則導航的狀態就是 confirmed (確認的)。
next(false): 中斷當前的導航。如果瀏覽器的 URL 改變了(可能是用戶手動或者瀏覽器后退按鈕),那么 URL 地址會重置到 from 路由對應的地址。
next(‘/') 或者 next({ path: ‘/' }): 跳轉到一個不同的地址。當前的導航被中斷,然后進行一個新的導航。
(一).全局守衛(全局路由鉤子)
你可以使用 router.beforeEach 注冊一個全局前置守衛:
const router = new VueRouter({ ... }) router.beforeEach((to, from, next) => { // ... next() })
另外有需要云服務器可以了解下創新互聯scvps.cn,海內外云服務器15元起步,三天無理由+7*72小時售后在線,公司持有idc許可證,提供“云服務器、裸金屬服務器、高防服務器、香港服務器、美國服務器、虛擬主機、免備案服務器”等云主機租用服務以及企業上云的綜合解決方案,具有“安全穩定、簡單易用、服務可用性高、性價比高”等特點與優勢,專為企業上云打造定制,能夠滿足用戶豐富、多元化的應用場景需求。
網頁題目:詳解Vue路由鉤子及應用場景(小結)-創新互聯
文章轉載:http://www.xueling.net.cn/article/cogphc.html