Значок, размещенный в Buefy Navbar, работает неправильно - PullRequest
Новая
       72

Значок, размещенный в Buefy Navbar, работает неправильно

0 голосов
/ 05 мая 2020

Я пытаюсь использовать значки в элементах панели навигации.

Глядя на документацию здесь , кажется, что нет возможности передать значок, поэтому мой код выглядит следующим образом: 

<b-navbar-item v-for="item in navItems" :key="item.text" tag="router-link" :to="{ path: item.route }">
    <div>
        <b-icon
            :icon="item.icon"
            size="is-small">
        </b-icon>
    </div>
    <div>
        {{item.text}}
    </div>
</b-navbar-item>

Теперь появляются значки, но для решения следующих двух проблем были введены 2 внутренних блока:

(1) на широких экранах значок перекрывает текст меню и (2) на мобильных устройствах , значок и текст отображаются в разных строках

enter image description here enter image description here

Как только я помещаю классы в div для достижения горизонтального выравнивания и интервал, мобильное меню перестает автоматически закрываться после выбора элемента (как обычно и должно).

Есть ли лучший способ достичь этой цели с помощью Navbar или боковая панель - единственный вариант?

...