Vue中瀏覽器的的前進和后退


  項目開發的時候,有時候可能需要我們來對頁面后退和前進,這個東西跟瀏覽器自帶的前進后退功能很像,下面來大致講一下在vue中瀏覽器的前進和后退

 

一、后退功能

vue中的后退有好多種方法可以使用,使用這些方法前要確認有之前的頁面,否則后退就到了一個空頁面!

 

可以通過history.length來獲取歷史記錄的長度

console.log(history.length)

 

 

1.window.history對象中保存有頁面訪問的歷史記錄,在編寫時可不使用 window 這個前綴。 加載歷史列表中的前一個URL,這與在瀏覽器中點擊前進按鈕是相同的

window.history.back();   后退1步

history.back();               后退1步

 

2.this.$router.go(-1);      通過vue的路由來進行后退1步

   this.$router.go(-2);      后退2步

   this.$router.back();      后退1步

 

二、前進功能

可以通過history.forward(); 來加載歷史列表中的下一個URL,這與在瀏覽器中點擊前進按鈕是相同的,使用前需要確認有下一個URL,否則沒反應~

 

 

嗯,就醬~~


免責聲明!

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



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