단계 (Stepper)

v-stepper 컴포넌트는 숫자가 매겨진 단계를 가진 진행상태를 표시합니다.

사용법

단계(stepper) 는 쇼핑 카트나 레코드 생성 등 여러 시나리오에 사용될 수 있습니다.


API

예제

편집가능한 단계 (Editable steps)

편집가능한 단계는 언제라도 사용자가 선택할 수 있으며 해당 단계로 이동됩니다.


편집할 수 없는 단계 (Non-editable steps)

편집할 수 없는 단계는 사용자가 프로세스를 선형적으로만 진행할 수 있도록 강제합니다.


선택적 단계 (Optional steps)

선택적 단계는 보조 문자열(sub-text) 와 함께 호출 할 수 있습니다.


수평 단계 (Horizontal steps)

수평 단계는 유저가 X 축 위에서 정의된 단계를 따라 이동하게 합니다.


수직 단계 (Vertical steppers)

수작 단계는 유저가 Y 축 위에서 정의된 단계를 따라 이동하게 합니다. 이를 제외하면 수평단계와 똑같이 작동합니다.


선형 단계 (Linear steppers)

선형 단계는 사용자가 언제나 미리 정의된 경로를 따라 이동하게 합니다.


비선형 단계 (Non-linear steppers)

비선형 단계는 사용자의 선택에 따라 미리 정의된 진행방식을 따라 이동하게 합니다.


대체 레이블 (Alternate labels)

타이틀을 단계 아래에 배치할 수 있습니다.


여러 줄 오류 상태 (Multi-line error state)

사용자에게 필수적인 액션을 알리기 위해 오류 상태를 표시할 수 있습니다.


여러줄 오류 상태의 대체 레이블 (Alternative label multi-line error state)

오류 상태에 대체 레이블 스타일을 적용할 수 있습니다.


세로 여러 줄 오류 상태 (Vertical multi-line error state)

오류 상태는 수직 단계로 표시할 수도 있습니다.


동적 단계 (Dynamic steps)

각 단계는 동적으로 추가되거나 제거 될 수 있습니다. 현제 활성화된 단계가 제거될 경우, 적용된 모델을 변경하여 이를 적절이 관리해야 합니다..