VUE中路由變化this.$router(push\replace\go\back)解讀
更新時間:2023年10月24日 11:27:31 作者:前端不加班
這篇文章主要介紹了VUE中路由變化this.$router(push\replace\go\back),具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教
1.this.$router.push()
描述
跳轉到指定的url,但這個方法回向history添加一個記錄,點擊后退會返回到上一個頁面。
用法
// 1字符串 this.$router.push('/user/order') // 2對象 this.$router.push({ path: '/user/order' }) //3傳參 this.$router.push({ path: '/user/order', query: {id: 123} }) //3-1取參數 this.$route.query.id //4命名的路由 this.$router.push({ name: '/user/order', params: {id: 123} }) //4-1取參數 this.$route.params.id
2.this.$router.replace()
描述
同樣是跳轉到指定的url,但是這個方法不會向history里面添加新的記錄,點擊返回,會跳轉到上上一個頁面。上一個記錄是不存在的。
用法
同this.$router.push()
3.this.$router.go()
原頁面表單中的內容會丟失
this.$router.go(-1)
:后退+刷新;this.$router.go(0)
:刷新;this.$router.go(1)
:前進
4.this.$router.back()
原頁表表單中的內容會保留
this.$router.back(-1)
:后退 ;this.$router.back(0)
:刷新;this.$router.back(1)
:前進
總結
以上為個人經驗,希望能給大家一個參考,也希望大家多多支持腳本之家。
相關文章
在Vue中實現(xiàn)圖表數據的動態(tài)展示的示例代碼
隨著數據可視化技術的發(fā)展,圖表在前端開發(fā)中扮演著越來越重要的角色,Vue.js 作為一個流行的前端框架,以其靈活性和易用性,成為了實現(xiàn)圖表動態(tài)展示的理想選擇,在這篇博客中,我們將學習如何在 Vue 3 中實現(xiàn)動態(tài)展示圖表數據,需要的朋友可以參考下2024-11-11ElementUi中select框在頁面滾動時el-option超出元素區(qū)域的問題解決
本文主要介紹了ElementUi中select框在頁面滾動時el-option超出元素區(qū)域的問題解決,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧2024-08-08關于element-ui?select?下拉框位置錯亂問題解決
這篇文章主要介紹了關于element-ui?select?下拉框位置錯亂問題解決,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教2022-09-09