demo2] です。"/> demo2] です。">

ホームページ  >  記事  >  ウェブフロントエンド  >  Vueファイルにジャンプページを実装する方法

Vueファイルにジャンプページを実装する方法

coldplay.xixi
coldplay.xixiオリジナル
2020-11-24 10:48:027877ブラウズ

Vue ファイルはジャンプ ページ メソッドを実装します: Vue ファイル間のジャンプは [b988a8fd72e5e0e42afffd18f951b277] を通じて実装されることが多く、コードは [9c0c376ddbe97047c47dd14d3f3103bf demo2]。

Vueファイルにジャンプページを実装する方法

#このチュートリアルの動作環境: Windows 7 システム、Vue バージョン 2.9.6。この方法は、すべてのブランドのコンピューターに適しています。 。

ページにジャンプするための Vue ファイル実装方法:

vue の使用中、vue ファイル間のジャンプは

b988a8fd72e5e0e42afffd18f951b277<strong>このコンポーネントは、ナビゲーション リンクを設定し、さまざまな HTML コンテンツを切り替えるために使用されます</strong>使用法:

1. 簡単な記述方法

<router-link to="demo2">demo2</router-link>

2. v-bindを使った記述方法

<router-link :to="‘demo2‘">demo2</router-link>
<!-- 也可以用{}包裹对应的path或name -->
<router-link :to="{ name: ‘demo2‘ }">demo2</router-link>

3. パラメータを渡す記述方法

<router-link :to="{ name: ‘demo2‘, params: { userId: 123 }}">demo2</router-link>

ここで渡すパラメータはrouter.js で修正されます。demo2 のパスを設定し、次のようにワイルドカード: と、パス内の demo2 の後に対応する userId を追加します:

{
  path: ‘/demo2/:userId‘,
  name: ‘demo2‘,
  component: demo2
},

設定が完了すると、ページ ジャンプの結果は /demo2 になります。 /123

ここで、「123」は上記の userId です

関連学習の推奨事項:

JavaScript ビデオ チュートリアル

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

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。