v-bottom-navigation 사이드바(sidebar)의 대용품입니다. 주로 모바일 장치에 사용하면 두가지 변형 "아이콘과 텍스트", shift가 있습니다.

Usage

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

예제

색상 Color

The color prop applys a color to the background the bottom navigation. It is recommended to use the light and dark props to properly contrast text color.

Grow

If v-bottom-navigation has grow property, buttons within it grow to fill available space.

Horizontal

The horizontal prop, places nav text next to the icon as appose to beneath it.

Shift

The shift prop will hide the button text until active. For this to work, v-btn text is required to be wrapped in a <span> tag.

토글 (Toggle)

다른 Vuetify 컴포넌트들 처럼, v-model 로 표시 상태를 조절할 수 있습니다.

Hide on scroll

Hide-on-scroll hides v-bottom-navigation when target element is scrolled.

Scroll threshold

scroll-threshold property allows you to customize the threshold you can scroll before v-bottom-navigation disappears.

Edit this page | language on Github
Vuetify
상점For Enterprise