Нижняя навигация
V-bottom-nav является альтернативой боковой панели. Он в основном используется на мобильных устройствах и поставляется в двух вариантах: значки и текст, а также сдвиг.
Применение
While the bottom nav is meant to be used with the vue-router, you can also programmatically control the active state of the buttons by using the active.sync prop. You can change a button's value by using its value attribute.
API
Позиционировать элемент абсолютно
Удерживает значение текущей активной кнопки. Если кнопка не имеет значения, вместо этого будет использоваться его индекс. Эта поддержка поддерживает модификатор .sync.
Назначает компонент как часть макета приложения. Используется для динамической настройки размера содержимого
Применяет заданный цвет к элементу управления
Применяет тёмный вариант темы
Установите фиксированный элемент
Установка высоты компонента
Применяет светлый вариант темы
Components.BottomNavigation.
Скрыть текст кнопки, если не активен
Контроль видимости
Примеры
Цвет и переключение
При использовании цветного фона рекомендуется использовать свойство light. Свойство shift скроет текст кнопки до тех пор, пока не будет активна. Имейте в виду, что текст v-btn должен быть обёрнут тегом <span> .
Переключатель
Как и другие компоненты Vuetify, вы можете управлять состоянием отображения с помощью v-model.