處理返回鍵劫持(結合vue)


在這里記錄一下近期解決的一個問題

需求,在某個頁面,瀏覽器返回按鈕點擊的時候,不能走瀏覽器的默認返回操作,而是要走自己的邏輯,

比如跳轉頁面等等。

那么問題來了,如何去不走默認返回呢。經過網上搜羅和同事交流之后,去研究了一下history的原理及

相關關鍵操作:

我們在需要操作的頁面進來的時候push一條state,那么瀏覽器返回的時候就走到了你原頁面,這個時候

去監聽hashchange或者popstate事件然后做出對應的邏輯處理

看看我在vue里面是怎么處理的

這里的recharge1和recharge是同一個組件,只是用了不同的path做區分而已,在beforeRouteEnter的hook里面

對 from 的路由信息進行判斷,如果balabala就balabala(自己看代碼)。

===================================================================================

如果拋除vue去看這個問題的話也同理,可以push一個state,把url的hash改掉,接着去監聽hashchange

window.addEventListener("hashchange",function(){},false);

這個時候點返回按鈕就會觸發hashchange事件,然后你就可以在回調里面做自己想做的邏輯了。

 


免責聲明!

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



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