vue iviewのメニューコンポーネントMuneがハイライトしないソリューションをクリックします。


前書き:プロジェクトの中で、私はvue+iview+vue-routerの開発を使いました。その後、ナビゲーションバーはiviewのMenuコンポーネントを使いましたが、ナビゲーションバーの内容は一回クリックしたらハイライトモードが表示されないことに気づきました。先にジャンプしました。もう一度クリックしたら、ハイライトが表示されます。
vue-routerの文書を見て、使いやすいものがあることが分かりました。router-linkの属性です。active-classとexact。
どうしてrouter-linkを使いますか?公式サイトではこれらのメリットを説明しています。
コンポーネントは、ユーザーがルーティング機能を持つアプリケーション(クリック)でナビゲーションをサポートします。ト属性でターゲットアドレスを指定することで、デフォルトでは正しくリンクされたaタグを描画します。また、ターゲットルーティングが有効になった場合、リンク要素はアクティブを表すCSSクラス名を自動的に設定します。
死を書くHTML 5 history mo doであれば、hash mo doであれば、それの表现は一致しています。です。ルーティンmo doを切った场合や、IE 9の降格时にhash mo doを使用する场合は、何の変化かをさらに分かります。HTML 5 history mo doでは、router-linkはクリックベトをガルド、ブラウザにペルージを再ロートするようにします。HTML 5 history mo doでbase opsiを使用すると、してのto属性は书く必要があります。まず、active-classは明るい時のスタルを指定します。例えば、白い字のスタルを定義します。 カラー:(菗菗fff) font-weight:bold; ④、exactでございます。绍介はこちらです。exact ti Pr:buckren de.false「アコースティック」のデフォは、inclusive matchである。例えば、現在の経路が/aで始まると、CSSクラス名が設定されます。これのルールによって、各ルートがアコースティックになっています。リンクに「exact mack」を使用するには、exact属性を使用します。これのリンクは、アドレス/の时のイアコースティックになります。Menu con po-nentのデフォ-ドはナビゲームに影响するかもしれないですが、考えってのです、Menu Cont Nent to to toを使ずに、ullabelを使用します。最后に、私のコのド长はここです。 <ul> <li> <router-link to=「/」active-class=「active」トップページ</roouter-link> </li> </ul>そし、公式サイトではここのよにプレレです。 を選択します <router-link to=“/”active-class=“active”のトップページ</a><roouter-link> </ul> ` 以上のこのvue iviewのメニ编が见えない内容に分か合うで、みなに一つの参考をすることができます。