Vueにタグをジャンプする方法

VUEでタグのジャンプを実装する方法には、HTMLテンプレートでAタグを使用してHREF属性を指定する方法が含まれます。 VUEルーティングのルーターリンクコンポーネントを使用します。 JavaScriptでこれを使用します。$ router.push（）メソッド。パラメーターはクエリパラメーターに渡すことができ、ルートは動的ジャンプのルーターオプションで構成できます。

タグジャンプのvue

Vue.jsでは、次の手順でタグジャンプを達成できます。

1.タグを追加します

HTMLテンプレートで、Aタグを使用して、HREF属性を指定します。

 <code class="html"><a href="/my-page">跳转到我的页面</a></code>

2。VUEルーティング

VUEルーティングを使用している場合は、Aタグの代わりにrouter-linkコンポーネントを使用できます。

 <code class="html"><router-link to="/my-page">跳转到我的页面</router-link></code>

これにより、Vueのルーティングシステムを使用してページリダイレクトを実行するため、ページのリロードが回避されます。

3。JavaScript

動的ジャンプにJavaScriptを使用する場合は、 this.$router.push()メソッド：

 <code class="javascript">this.$router.push('/my-page')</code>

パラメーターパス

ジャンプ中にパラメーターを渡す必要がある場合は、 queryパラメーターを使用できます。

HTMLテンプレート

<a href="/my-page?id=123">传递参数123</a>

Vueルーティング

<router-link to="/my-page" :query="{ id: 123 }">传递参数123</router-link>

JavaScript

 <code class="javascript">this.$router.push({ path: '/my-page', query: { id: 123 } })</code>

知らせ：

• vue-routerがVueインスタンスにインストールされていることを確認してください。
• 動的ジャンプの場合、 routerオプションでルーティングを構成する必要があります。

以上がVueにタグをジャンプする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。