vue路由跳轉(zhuǎn)router-link清除歷史記錄的三種方式(總結(jié))
路由跳轉(zhuǎn)router-link清除歷史記錄
1.在vue項目中說起路由跳轉(zhuǎn),我們最先想到的就是router-link標簽以及this.$router.push函數(shù)。
router-link和this.\$router.push的實現(xiàn)原理是一樣的,在點擊router-link時,內(nèi)部調(diào)用的就是this.$router.push。
2.this.\$router.push這個方法會向 history 棧添加一個新的記錄,所以,當(dāng)用戶點擊瀏覽器后退按鈕時,則回到之前的 URL。
那在我們使用路由跳轉(zhuǎn)的時候如何去掉歷史記錄呢?
官方文檔提供了如下三種方式
1.使用router-link標簽時去掉歷史記錄:加上replace屬性
<router-link to='/project_selection' replace class='btn_none' tag="a">項目列表</router-link>
2.使用this.\$router.push標簽時去掉歷史記錄:加上replace屬性,默認值為false
this.$router.push({path: '/project_selection',replace:true})
3.使用this.\$router.replace標簽時去掉歷史記錄
this.$router.replace({path: '/project_selection'})
所有內(nèi)容源自于官網(wǎng):vue路由核心插件
vue跳轉(zhuǎn)后不記錄歷史記錄
vue路由跳轉(zhuǎn)一般情況下是使用push,
?this.$router.push({ ? ? ? ? ? ? ? ? path: "/testTeam/testTeam", ? ? ? ? ? ? ? });
若是特殊需求,頁面跳轉(zhuǎn)后不記錄到歷史記錄中,將push改為replace即可
this.$router.replace({path: '/project_selection'})
以上為個人經(jīng)驗,希望能給大家一個參考,也希望大家多多支持腳本之家。
相關(guān)文章
Vuex數(shù)據(jù)持久化實現(xiàn)的思路與代碼
Vuex數(shù)據(jù)持久化可以很好的解決全局狀態(tài)管理,當(dāng)刷新后數(shù)據(jù)會消失,這是我們不愿意看到的。這篇文章主要給大家介紹了關(guān)于Vuex數(shù)據(jù)持久化實現(xiàn)的思路與代碼,需要的朋友可以參考下2021-05-05vue子傳父關(guān)于.sync與$emit的實現(xiàn)
這篇文章主要介紹了vue子傳父關(guān)于.sync與$emit的實現(xiàn),文中通過示例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-11-11