멀티 셀렉트

여러 데이터를 리스트에서 선택하거나 추가할 수 있습니다.

프로퍼티

프로퍼티	타입	설명
이름 (name)	string	멀티 셀렉트 컴포넌트의 고유 이름
레이블 (label)	string	멀티 셀렉트 좌측에 표기되는 텍스트
코드 (code)	string (Option[])	멀티 셀렉트 옵션의 배열을 반환하는 코드
기본값 (defaultValue)	string (OptionValues)	기본 값 배열을 반환하는 코드
플레이스홀더 (placeholder)	string	멀티 셀렉트에 적용되는 플레이스홀더
컴포넌트 비활성화 (isDisabled)	boolean	멀티 셀렉트 비활성화 여부
컴포넌트 숨김 (isHidden)	boolean	배포된 페이지에서 멀티 셀렉트 숨김 여부
레이블 길이 (labelWidth)	string	멀티 셀렉트에서 좌측 레이블이 차지하는 길이

이름 (name)

멀티 셀렉트 컴포넌트의 고유 이름을 입력할 수 있는 프로퍼티입니다. 이름 규칙을 참고해주세요.

레이블 (label)

멀티 셀렉트 좌측에 표기되는 텍스트를 입력할 수 있는 프로퍼티입니다. (템플릿 텍스트 입력 가능)

코드 (code)

워크플로우의 실행 결과로 옵션을 추가하거나, 직접 값을 입력하여 옵션을 추가할 수 있습니다.

기본값 (defaultValue)

워크플로우의 실행 결과로 기본값을 설정하거나, 직접 값을 입력하여 기본값을 설정할 수 있습니다.

멀티 셀렉트에서 값을 선택하면 기본값과 별개로 선택한 값이 선택됩니다.

플레이스홀더 (placeholder)

직접 값을 입력하여 필드의 플레이스홀더를 설정할 수 있습니다. 플레이스홀더를 설정하지 않으면 각 필드의 기본 플레이스홀더가 표시됩니다.

컴포넌트 비활성화 (isDisabled)

컴포넌트의 비활성화 상태를 입력하는 프로퍼티입니다.
워크플로우의 실행 결과를 사용하거나 직접 값을 입력하여 컴포넌트 비활성화 상태를 설정할 수 있습니다. 값을 true로 설정할 경우, 해당 컴포넌트가 비활성화 상태로 변경됩니다.

컴포넌트 숨김 (isHidden)

컴포넌트의 숨김 상태를 입력하는 프로퍼티입니다.
워크플로우의 실행 결과를 사용하거나 직접 값을 입력하여 컴포넌트 숨김 상태를 설정할 수 있습니다.
값을 true로 설정할 경우, 배포된 상태에서는 컴포넌트가 숨겨지고 편집 상태에서는 불투명한 상태로 편집이 가능합니다.

레이블 길이 (labelWidth)

직접 값을 입력하여 레이블 길이를 지정할 수 있습니다. px 또는 % 단위에 맞게 값을 입력하면 해당 값에 따라 레이블의 길이가 조정됩니다.

상태

프로퍼티	타입	설명
값 (values)	OptionValues	선택된 옵션의 value 배열

타입 정의

interface Option {
  // 옵션의 레이블
  label: string;
  // 옵션의 값
  value: string;
  // 옵션 표시 여부
  isVisible?: boolean;
}

type OptionValues = string[];