如果在 beforeRouteLeave 鈎子中跳轉到指定鏈接?

https://www.mmxiaowu.com/article/5b84fa5c2f52003e4d38c657

 

有這么一個需求, 需要在用戶離開時, 彈窗讓用戶選擇[是]/[否]按鈕來決定頁面跳轉, 如果選[是]則跳轉到一個頁面, 選否則留在當前頁面

第一想法肯定是在beforeRouteLeave做相關邏輯

beforeRouteLeave(to, from, next) { const answer = window.confirm('...') if (answer) { next('/some/path') } else { next(false) } }

結果出現了死循環, 因為在調用next('/some/path')時, 又觸發了beforeRouteLeave, 從而又執行了next('/some/path'), 所以出現了死循環

處理方法也很簡單:

beforeRouteLeave(to, from, next) { if (to.fullPath === '/some/path') { return next() } const answer = window.confirm('...') if (answer) { next('/some/path') } else { next(false) } }

在離開路由時, 判斷目的地址, 如果目的地址符合的情況, 直接跳轉, 不再彈窗詢問

但是也會出現一個問題, 就在當前頁面直接點目的地址時(如果有), 就會不出現彈窗, 而直接跳轉到目標地址, 當然也可以加些query來區別直接點擊和next()的地址