Vue でルートをジャンプする方法をご存知ですか?

1. パラメータなし <router-link :to="{name:'home'}"> 
<router-link :to="{path:'/home'}"> //名前でもパスでもどちらでも構いませんが、名前の使用を推奨します  
// 注意: router-link 内のリンクが '/' で始まる場合、ルート ルートから開始されます。 '/' で始まらない場合は、現在のルートから開始されます。
2. パラメータ <router-link :to="{name:'home', params: {id:1}}"> を使用  
// params はパラメータを渡します (post と同様)
// ルーティング構成パス: "/home/:id" またはパス: "/home:id" 
// パスを設定しない場合、初回はリクエストできますが、ページを更新すると ID は消えます // パスを設定すると、ページを更新しても ID は保持されます // HTML はパラメータ $route.params.id を取得します
// スクリプトはパラメータ this.$route.params.id を受け取ります
<router-link :to="{name:'home', クエリ: {id:1}}"> 

// 文字列 router.push('home')
// オブジェクト router.push({ path: 'home' })
// 名前付きルート router.push({ name: 'user', params: { userId: '123' }})
// クエリパラメータを使用すると、/register?plan=private になります
router.push({ パス: 'register', クエリ: { プラン: 'private' }})

定数ユーザーID = '123'
router.push({ name: 'user', params: { userId }}) // -> /user/123
router.push({ パス: `/user/${userId}` }) // -> /user/123
// ここでのパラメータは有効ではありません router.push({ path: '/user', params: { userId }}) // -> /user

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 を受け取ります
// スクリプトはパラメータ this.$route.query.id を受け取ります
3. paramsパラメータ this.$router.push({name:'home',params: {id:'1'}}) // 名前のみ使用可能
// ルーティング構成パス: "/home/:id" またはパス: "/home:id" 、
// パスを設定しない場合、初回はリクエストできますが、ページを更新すると ID は消えます // パスを設定すると、ページを更新しても ID は保持されます // HTML はパラメータ $route.params.id を取得します
// スクリプトはパラメータ this.$route.params.id を受け取ります
4. クエリとパラメータの違い。クエリは get に似ています。ページがリダイレクトされた後、?id=1 と同様に、パラメータが URL に追加されます。重要でないパラメータは、この方法で渡すことができます。パスワードなどは、引き続き params で渡すことができます。リフレッシュ ページ ID は、引き続き params にあります。post と同様に、ページがリダイレクトされた後、パラメータは URL に追加されませんが、リフレッシュ ページ ID は消えます。**注: ルートのパラメータを取得するには、最後に r を付けずに $route を使用します**

this.$router.go(n)
n ページ前または後ろにジャンプします。n は正または負の整数です。ps: this.$router.push との相違点
指定された URL パスにジャンプし、履歴スタックにレコードを追加します。戻るをクリックすると、前のページに戻ります。this.$router.replace
指定された URL パスにジャンプしますが、履歴スタックには記録されません。[戻る] をクリックすると、前のページに移動します (つまり、現在のページが直接置き換えられます)。
this.$router.go(n)
n ページ前または後ろにジャンプします。n は正または負の整数です。