`router-link-active`クラス名は、予期せず、`/`を指している<router-link>に当てはまります。

Question

私はVueプロジェクトで非常に基本的なルーティングをvue-routerで設定しました。

router-link-active classnameはアクティブルートに期待通りに適用されます。次のgifで/fooがアクティブである場合、それはなど、「フー」となり

しかし、「こんにちは」へのリンクもrouter-link-activeクラス名を持っています。

なぜ適用されるのですか。/（localhost:8080）になっているときに、それが有効であることを確認するにはどうすればよいですか？

Answer 1

は、デフォルトのアクティブクラスのマッチングの振る舞いが包括試合で、あなたの"/"ルート

にexact小道具を置きます。 の例では、現在のパスが/ aで始まる限り、このクラスは適用されます（ ）。

すべてのルートでアクティブ になります。 正確な小道具を使用し、 "完全一致モード" へのリンクを強制的に：

<!-- this link will only be active at/--> 
    <router-link to="/" exact> 

をここでは何が必要です：jsFiddle