vue路由跳轉router-link清除歷史記錄的三種方式(總結)
更新時間：2022年04月09日 16:57:15 作者：一羊遷徙
這篇文章主要介紹了vue路由跳轉router-link清除歷史記錄的三種方式，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教
路由跳轉router-link清除歷史記錄
1.在vue項目中說起路由跳轉，我們最先想到的就是router-link標簽以及this.$router.push函數(shù)。
router-link和this.\$router.push的實現(xiàn)原理是一樣的，在點擊router-link時，內部調用的就是this.$router.push。
2.this.\$router.push這個方法會向 history 棧添加一個新的記錄，所以，當用戶點擊瀏覽器后退按鈕時，則回到之前的 URL。
那在我們使用路由跳轉的時候如何去掉歷史記錄呢？
官方文檔提供了如下三種方式
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'})所有內容源自于官網：vue路由核心插件
vue跳轉后不記錄歷史記錄
vue路由跳轉一般情況下是使用push，
?this.$router.push({
? ? ? ? ? ? ? ? path: "/testTeam/testTeam",
? ? ? ? ? ? ? });若是特殊需求，頁面跳轉后不記錄到歷史記錄中，將push改為replace即可
this.$router.replace({path: '/project_selection'})以上為個人經驗，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關文章
這篇文章主要介紹了vue實現(xiàn)菜單切換功能,代碼簡單易懂，非常不錯，具有一定的參考借鑒價值，需要的朋友可以參考下2019-05-05
這篇文章主要介紹了淺談VUE中演示v-for為什么要加key，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2020-01-01
Vuex數(shù)據(jù)持久化實現(xiàn)的思路與代碼
Vuex數(shù)據(jù)持久化可以很好的解決全局狀態(tài)管理,當刷新后數(shù)據(jù)會消失,這是我們不愿意看到的。這篇文章主要給大家介紹了關于Vuex數(shù)據(jù)持久化實現(xiàn)的思路與代碼，需要的朋友可以參考下2021-05-05
作為使用Vue的開發(fā)者，我們對Vue指令一定不陌生，諸如v-model、v-on、等，同時Vue也為開發(fā)者提供了自定義指令的api，熟練的使用自定義指令可以極大的提高了我們編寫代碼的效率，讓我們可以節(jié)省時間開心的摸魚2023-04-04
這篇文章主要為大家詳細介紹了vue前端信息詳情頁模板梳理，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-04-04
這篇文章主要為大家詳細介紹了Vue組件實現(xiàn)數(shù)字滾動抽獎效果，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-03-03
這篇文章主要介紹了vue子傳父關于.sync與$emit的實現(xiàn)，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2019-11-11
這篇文章主要介紹了vue+ESLint 配置保存 自動格式化代碼的相關知識，本文通過實例代碼給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值,需要的朋友可以參考下2020-03-03
這篇文章主要介紹了使用vue-router切換組件時使組件不銷毀問題，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-09-09
這篇文章主要介紹了使用 Vue 綁定單個或多個 Class 名的實例代碼，非常不錯，具有參考借鑒價值，需要的朋友參考下吧2018-01-01