2017-10-30 22 views
0

通常のページではドロップダウンが完全に機能しています。VueルータでBulmaドロップダウンが消える

SPAのように機能するVue-routerを使用すると、カーソルを非常に速く動かさない限り、navbar-itemとそのchild navbar-linkの間でドロップダウンが消えます。

ルータページのhtmlに、またはルータビューとnavの間に隙間や余白がありません。通常のWebページでは、navbar-itemとドロップダウンメニューとの間の遷移はシームレスです。しかしルータのページでは、カーソルが外側のdivの内側に囲まれた内側のタグから離れるとドロップダウンが消えます。

// outer tag 
<div class="navbar-item has-dropdown is-hoverable"> 
    // inner tag 
    <a class="navbar-link">More:</a> 
</div> 

スタイルを設定=「高さ:100%」タグが

https://bulma.io/documentation/components/navbar/

+0

コードに入力ミスがあります。引用符ではなく、ホバリング可能な後にコロンがあります。 –

+1

正しいのは、サンプルコードの入力ミスです。 " – Dazzle

+0

ok、あなたはこのバグを再現してスニペットを追加できますか?私はvue-routerの問題ではなく、スタイルや何かではないと思っていますが、 navbar-dropdownの 'top'値を指定します。 –

答えて

0

が列上記
を追加することによって、これを修正し、外側のdivの内側に完全に収まるようにするために動作しないことvue-routerの子供がいた

vueやbulmaのシンプルさを決して複雑にしないでください!

関連する問題