ホームページ >ウェブフロントエンド >フロントエンドQ&A >Vue のセカンダリ ルーティングがエラーを報告した場合はどうすればよいですか?
セカンダリ ルーティング エラーの解決策: 1. セカンダリ ルーティング パスの前のスラッシュを確認して削除します; 2. 親ルートにパスがあるかどうかを確認します。パスがスラッシュの場合、リダイレクトは直接一致します。 page2; 3. リダイレクトを使用せず、デフォルトで表示されるサブルート パスを空に設定します。
#このチュートリアルの動作環境: Windows 10 システム、Vue バージョン 3、Dell G3 コンピューター。
vue セカンダリ ルーティングがエラーを報告した場合はどうすればよいですか?
vue でのセカンダリ ルートのジャンプが失敗する理由の 1 つは、
#セカンダリ ルートに特定のパスがある場合、は前に追加されていません Slash/
vue セカンダリ ルートではページが表示されません bug
If親ルートのパスは / である場合、リダイレクトは page2
{ path: '/', component: () => import('../view/analyse/analyse.vue'), redirect: '/page2', //这里前面加不加/都行 children: [ { path: 'page1',//这里前面加不加/都行 component: () => import('../view/analyse/page/page1') }, { path: 'page2',//这里前面加不加/都无所用 component: () => import('../view/analyse/page/page2') }, ] }
に直接一致できます。親ルートにパスがある場合、リダイレクトの前に親ルートを置く必要があります。そうでない場合、それは /子パスになり、子ルートになります。デフォルトでは /親パス/子パスと一致する必要があります
{ path: '/analyse', component: () => import('../view/analyse/analyse.vue'), redirect: '/analyse/page2',//这里前面加不加/都行,必须父路由/子路由 children: [ { 重点:::::::: //这里前面不能加 /不然就会匹配成/page1 path: 'page1', 实际他等同于 /analyse/page1 //这里前面不能加 /不然就会匹配成/page1 component: () => import('../view/analyse/page/page1') }, { path: 'page2', //这里前面不能加 / component: () => import('../view/analyse/page/page2') }, { path: 'page3', //这里前面不能加 / component: () => import('../view/analyse/page/page3') } ] }
リダイレクトを使用しない場合、デフォルトで表示されるサブルートのパスは空です。
{ path: '/', 或者 path: '/analyse', component: () => import('../view/analyse/analyse.vue'), children: [ { path: '' , path为空就可以了 component: () => import('../view/analyse/page/page1') }, { path: 'page2', component: () => import('../view/analyse/page/page2') }, ] }
親ページサブルートのコンテンツを表示するにはプレースホルダー タグが必要です
<div class="content"><router-view /></div>
推奨学習:《vue.js ビデオ チュートリアル》
以上がVue のセカンダリ ルーティングがエラーを報告した場合はどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。