1. 程式人生 > >this.$router.push、replace、go的區別

this.$router.push、replace、go的區別

1、this.$router.push

描述:跳轉到不同的url,但這個方法會向history新增一個記錄,點選後會返回到上一個頁面
用法
//字串
this.$router.push('home')
//物件
this.$router.push({path:'home'})
//命名的路由
this.$router.push({name:'user',params:{userId:123}})
//帶查詢引數,變成/register?plan=private
this.$router.push({path:'register',query:{plan:'private'}})

2、this.$router.replace

描述:同樣是跳轉到指定的url,但是這個方法不會向history裡面新增新的記錄,點選返回,會跳轉到上上一個頁面。上一個記錄是不存在的

3、this.$router.go

描述:相當於當前頁面向前或向後跳轉多少個頁面,蕾絲window.hisstory.go(n)。n可為正數或者也可以為負數
用法
//在瀏覽器記錄中前進一步,等同於history.forward()
this.$router.go(1)
//後退一步記錄
this.$router.go(-1)
//前進三步記錄
this.$router.go(3)