vue路由跳轉方式

2021-09-18 06:24:01 字數 1174 閱讀 1044

vue路由跳轉方式有四種,具體如下:

1、router-link

1.1.不帶引數

params傳引數 (類似post),路由配置 path: "/home/:id" 或者 path: "/home:id",不配置path ,第一次可請求,重新整理頁面id會消失,配置path,重新整理頁面id會保留。

html取參: $route.params.id,script取參:this.$route.params.id

query傳引數 (類似get,url後面會顯示引數),路由可不配置

html 取參:$route.query.id

2、this.$router.push()(函式裡面呼叫)

2.1.不帶引數

this.$router.push('/home')

this.$router.push()

this.$router.push()

2.2.query傳參 

this.$router.push(})

this.$router.push(})

html 取參:$route.query.id

script 取參:this.$route.query.id

2.3. params傳參

this.$router.push(})

只能用 name,路由配置 path: "/home/:id" 或者 path: "/home:id" ,不配置path ,第一次可請求,重新整理頁面id會消失. 配置path,重新整理頁面id會保留。

html取參:$route.params.id,script取參:this.$route.params.id

2.4. query和params區別

query類似 get, 跳轉之後頁面 url後面會拼接引數,類似?id=1, 非重要性的可以這樣傳.。

密碼之類還是用params重新整理頁面id還在,params類似 post, 跳轉之後頁面 url後面不會拼接引數 , 但是重新整理頁面id 會消失.

3、this.$router.replace()(用法同push)

4、this.$router.go(n)

this.$router.go(n)

向前或者向後跳轉n個頁面,n可為正整數或負整數。

vue路由跳轉的方式

vue路由跳轉有四種方式 1.router link 2.this.router.push 函式裡面呼叫 3.this.router.replace 用法同push 4.this.router.go n 一 不帶參 1.1 router link router link to router link...

vue路由跳轉的方式

vue路由跳轉有四種方式 1.router link 2.this.router.push 函式裡面呼叫 3.this.router.replace 用法同push 4.this.router.go n 一 不帶參 1.1 router link name,path都行,建議用name 注意 rou...

Vue 路由跳轉方式 和 路由跳轉時傳參

1 router link 2 router方式 js跳轉 this.router.push 以上就是兩種路由跳轉的方法 先說說params和query的不同之處 1.query所傳的引數會顯示在url上,params則不會 2.params傳遞的引數在瀏覽器重新整理時會清空,query則不會 1 ...