項目開發的時候,有時候可能需要我們來對頁面后退和前進,這個東西跟瀏覽器自帶的前進后退功能很像,下面來大致講一下在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,否則沒反應~
嗯,就醬~~