ホームページ  >  記事  >  ウェブフロントエンド  >  デフォルトルートがvue.jsに読み込まれないという問題

デフォルトルートがvue.jsに読み込まれないという問題

亚连
亚连オリジナル
2018-06-21 16:02:522323ブラウズ

この記事では主に、vue.js のデフォルト ルートが linkActiveClass を読み込まない問題の解決策をサンプル コードを通じて詳しく紹介します。これは、学習や仕事に必要な学習に役立ちます。フォローする 一緒に見てみましょう。

問題が見つかりました

最近、プロジェクトを開いたときに、デフォルトのルートが linkActiveClass で読み込まれていないことがわかりました

確認したところ、多くの学生もこの問題を抱えていることがわかりました。いくつかの情報を確認したところ、リダイレクトに関しては、公式 Web サイトのドキュメントに次のように書かれています

Redirect

リダイレクトもルート経由です。次の例では、/a から /b にリダイレクトします。

const router = new VueRouter({
routes: [
{ path: '/a', redirect: '/b' }
]
})

リダイレクト ターゲットは、名前付きルートにすることもできます:

const router = new VueRouter({
routes: [
{ path: '/a', redirect: { name: 'foo' }}
]
})

、またはリダイレクト ターゲットを動的に返すメソッドも使用できます。

const router = new VueRouter({
routes: [
{ path: '/a', redirect: to => {
// 方法接收 目标路由 作为参数
// return 重定向的 字符串路径/路径对象
}}
]
})

私のコードはもともと次のように見えました:

const router=new VueRouter({
linkActiveClass:'list-active',
routes:[
{
 path:'/',
 component:user
},
{
 path:'/user',
 component:user
},
{
 path:'/warship', 
 component:warship
}
]
})

このようにして、サブルートはロードされますが、そのデフォルトクラスは従いません。そして、リダイレクト:'/user'を追加して変更します。これに

変更後:

const router=new VueRouter({
linkActiveClass:'list-active',
routes:[
{
 path:'/',
 redirect:'/user',
 component:user
},
{
 path:'/user',
 component:user
},
{
 path:'/warship', 
 component:warship
}
]
})

は、デフォルトのルーティングクラスがロードされない問題を完全に解決します。

上記は私があなたのためにまとめたものです。

関連記事:

vueを使用してナビゲーションバーを実装する方法

vueコンポーネントでiframe要素を使用する方法

vuewebpackでコンポーネントをロードする方法require.ensure

で実装する方法Angular4 フォームの応答

以上がデフォルトルートがvue.jsに読み込まれないという問題の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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