ここでの例ではケースの英雄：
プロジェクト全体のルート
全体的なアイデアは、次のとおりです。エントリファイルプログラムとしてmain.jsは、あなたがルーティング関連のコードを書くことができますが、これは、単一責任の原則を遵守していないコードのメンテナンスを助長されていませんので、別のルートrouter.jsドキュメント管理を使用して、彼らはルータを作成する必要がありませんルートの.jsはでmain.jsに役割を果たすことができました。
詳細な手順：
1.書き込みパブリックコンポーネントappslider.vue <ルータビュー>
2.App.vue、セット<ルータビュー>コンテナ
3.router.js、導入およびVUE VUE-ルータ、見た目に導入する前に対応するパケットがインストールされているかどうかnode_modules、そして最終的にVue.use（VueRouter）。
4.router.js、インポート・コンポーネントはBar.vueは、List.vue、Foo.vueがレンダリングされる
経路ルーティング構成5.router.js
新しい新しいVueRouter（）：ルートの6.router.js例
7.router.jsルータの輸出目標
8.main.jsはrouter.jsを導入し
main.jsの新しいVueの例ルータ9マウントルートオプションを
英雄のリストからのルートの編集ページへ
>同じコンポーネントedit.vue「の状況をレンダリングする-ここでは英雄異なるクリック編集ボタンで似たようなケースとの契約があること、比較的一般的ではないが、比較的複雑な状況を記録しました。
本明細書でナビゲーション機能を使用した場合、充填する必要がないだけの機能は、組立第2のパラメータID値を満たすために必要なオブジェクトを押します。
詳細な手順：
JS 1.list.vueの一部：
methods->
showEditVue（ID）{Router.pushこの$（{名： '編集'、paramsは：{ID：ID}}）};
2.router.js 、構成IDをルーティング元の追加：
{パス：「/編集/：ID」}
このようなアプローチは、動的と呼ばれるルーティング
の3.edit.vue：
。パラメータ$ルーティングダイナミックを得るが、このroute.params.id
4.editを。 VUEで：
axios.get（+このURL \ route.params.id。）.then（（RES）=> {} this.formData = res.data）;
で5.edit.vue：
（）{ このマウント。 getHeroById（）;}
呼び出し4方法
ビューで取得した対象データに結合すること6. 5
