vueルーティングジャンプの4つの方法（パラメータークエリを使用）

1、ルーターリンク

（1）パラメータなし

<router-link :to="{name:'home'}"> 
<router-link :to="{path:'/home'}"> //name,path都行, 建议用name  
// 注意：router-link中链接如果是'/'开始就是从根路由开始，如果开始不带'/'，则从当前路由开始。

（2）パラメータ付き

<router-link :to="{name:'home', params: {id:1}}">  
 
// params传参数 (类似post)
// 路由配置 path: "/home/:id" 或者 path: "/home:id" 
// 不配置path ,第一次可请求,刷新页面id会消失
// 配置path,刷新页面id会保留
// html 取参  $route.params.id
// script 取参  this.$route.params.id

<router-link :to="{name:'home', query: {id:1}}"> 

// query传参数 (类似get,url后面会显示参数)
// 路由可不配置
// html 取参  $route.query.id
// script 取参  this.$route.query.id

2.this。$ router.push（）（関数内で呼び出す）

（1）パラメータなし

this.$router.push('/home')
this.$router.push({
    
    name:'home'})
this.$router.push({
    
    path:'/home'})

（2）クエリパラメータの転送

this.$router.push({
    
    name:'home',query: {
    
    id:'1'}})
this.$router.push({
    
    path:'/home',query: {
    
    id:'1'}})
 
// html 取参  $route.query.id
// script 取参  this.$route.query.id

（3）パラメータはパラメータを渡します

this.$router.push({
    
    name:'home',params: {
    
    id:'1'}})  // 只能用 name
 
// 路由配置 path: "/home/:id" 或者 path: "/home:id" ,
// 不配置path ,第一次可请求,刷新页面id会消失
// 配置path,刷新页面id会保留
// html 取参  $route.params.id
// script 取参  this.$route.params.id

（4）ueryとparamsの違い

1. クエリはgetに似ており、ジャンプ後、パラメータはページのURLの後にスプライスされますか？id = 1のように、重要でない場合はこのように渡すことができ、パスワードなどは引き続き更新に使用されますパラメータのあるページIDはまだあります
2. パラメータは投稿に似ています。ジャンプ後、パラメータはページのURLの後にスプライスされませんが、ページを更新するとページIDは表示されなくなります。

3.this。$ router.replace（）（使用法は上記と同じです。プッシュ）

4.this。$ router.go（n）

5.違い

1. this。$ router.push
   は、指定されたURLパスにジャンプし、履歴スタックにレコードを追加したい場合は、戻るをクリックして前のページに戻ります。
2. this。$ router.replace
   は指定されたURLパスにジャンプしますが、履歴スタックにはレコードがありません。クリックして戻ると、前のページにジャンプします（つまり、現在のページを直接置き換えます）。
3. this。$ router.go（n）
   nページ前後にジャンプします。nは正または負の整数です。