바닥 내비게이션 (Bottom nav)
v-bottom-nav
사이드바(sidebar)의 대용품입니다. 주로 모바일 장치에 사용하면 두가지 변형 "아이콘과 텍스트", shift가 있습니다.
사용법
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
요소를 절대 위치 시킴
현재 활성화된 버튼의 값이 저장됩니다. 만약 버튼에 지정된 값이 없다면, 버튼의 인덱스가 사용됩니다. 이 prop은 .sync 수식어(modifier)를 지원합니다.
컴포넌트를 어플리케이션 레이아웃은 한 부분으로 지정. 컨텐츠 크기를 동적으로 맞추는데 사용됨
컨트롤에 색상을 지정
다크 테마를 적용
요소의 위치를 고정
컴포넌트의 높이를 설정
라이트 테마를 적용
Components.BottomNavigation.
활성화되지 않을 시 버튼 택스트 숨기기
표시여부를 조절 (Controls visibility)
예제
Color & shift
배경색을 사용할때, light
prop을 사용하기를 권장합니다. shift
prop은 버튼이 활성화 되기 전에는 보이지 않게 합니다. v-btn
의 텍스트는 <span>
태그로 감싸야 한다는 점을 기억하십시오.
토글 (Toggle)
다른 Vuetify 컴포넌트들 처럼, v-model
로 표시 상태를 조절할 수 있습니다.