타임 피커 (Time picker)
v-time-picker는 다른 Vuetify 컴포넌트들에 사용될 수 있는 독자적(stand-alone) 컴포넌트 입니다. 타임 피커는 시간을 선택할 수 있는 시각적 표현을 제공합니다.
API
선택할 수 있는 시간(hour)를 제한
선택할 수 있는 분(minute)를 제한
Components.TimePickers.
컨트롤에 색상을 지정
다크 테마를 적용
Components.TimePickers.
사용가능한 옵션은 ampm과 24hr
100% 너비(width)를 가지도록 강제
헤더 색상을 정의. 지정되지 않은 경우 color prop이나 기본 피커 색상을 사용
가로방향 피커
라이트 테마를 적용
선택할 수 있는 최대 시간
선택할 수 있는 최소 시간
피커의 타이틀을 숨김
Components.TimePickers.
마우스 스크롤로 시간/분을 바꿀 수 있도록 설정
Components.TimePickers.
표시여부를 조절 (Controls visibility)
컨텐츠의 폭을 설정
예제
타임 피커 - 색상 (Time pickers - Colors)
타임 피커의 색상은 color와 header-color prop을 이용하여 설정할 수 있습니다. header-color가 제공되지 않으면 color prop이 사용됩니다.
타임 피커 - 다이얼로그와 메뉴 (Time pickers - In dialog and menu)
피커들의 유연성으로 인해, 원하는 방식을 정확히 그대로 구현할 수 있습니다.
타임 피커 - 24시간 형식 (24h format)
타임 피커는 24시간 형식으로 사용할 수 있습니다.
타임 피커 - 허락된 시간 (Allowed times)
선택 가능한 시간을 배열, 오브젝트, 함수를 이용하여 정의할 수 있습니다.
타임 피커 - 너비 지정(Setting picker width)
피커의 너비를 지정하거나 전체 너비로 만들 수도 있습니다.