vue-router使用next()跳轉到指定路徑時會無限循環


我在路由為 /path 的頁面這樣寫

1 beforeRouteLeave (to, from, next) {
2         console.log('離開路路由')
3        if(to.fullPath==='/home'){
4          next();
5        }else{
6          next('/home')
7        }
View Code

這個是組件路由,我想實現的效果是在這個頁面點擊瀏覽器的返回按鈕后要返回 /home頁面而不是上一個頁面,上面的代碼是沒問題的,而我之前的寫法就一直死循環

// 下面的寫法會死循環
     beforeRouteLeave (to, from, next) {
        console.log('離開路路由')
       next('/home')
}

  

問題及疑問:

 1.我不太明白為什么會死循環,我在home頁面也沒有寫任何鈎子函數來跳到result頁面啊,我也沒有寫全局的beforeEach鈎子函數。
 2.上面第一段代碼是可用的,自己瞎摸索出來的,但是不是很明白為什么要加那個判斷?
解決思路:
當執行鈎子函數時如果遇到next('/home')等時會中斷當前導航,比如當前導航是去/a,那么遇到next('/home')后就會把to.path改為/home,
然后會重新觸發這個離開的鈎子,注意:此時會重新觸發執行這個鈎子,而不是在這個鈎子函數繼續執行的,之前是一直沒理解這里,
以為是執行next('/home')后就會直接跳到home頁面呢,當重新觸發后就會繼續執行next('/home')所以會一直循環。
至於解決辦法就是判斷下,如果已經是/home了就next()。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM