...

Component Type

Cascader는 사용자가 연관된 데이터 세트에서 데이터를 선택하도록 단계별 데이터 선택 기능을 제공하는 컴포넌트이다. Single 타입의 기본 Cascader와 다중 선택을 위한 Multiple 타입의 CascaderMultiple 컴포넌트 2가지가 있다2가지로 제공한다.

( 참고: https://ionsdp.atlassian.net/wiki/spaces/ICE4P/pages/1543733287/Input+Component#Common-options )

1.

...

Cascader

Cascader 컴포넌트의 기본 UI는 다음과 같다. 입력 필드가 Active 상태로 되면 상위 데이터 목록이 출력되고, 원하는 데이터를 클릭하면 연결 된 하위 데이터 목록이 나타난다. 마지막 단계까지 모두 선택하면, 연관된 데이터 세트 정보가 모두 입력필드에 출력된다.

...

2.

...

CascaderMultiple

데이터 다중 선택 기능이 필요하다면 CascaderMultiple 컴포넌트를 사용 할 수 있다. 기본 UI는 다음과 같이 Cascader컴포넌트와 추가버튼 Cascader컴포넌트에 다중 선택을 위한 Add Icon Button()으로 구성되어 있다.

...

데이터를 선택하고 ^[1]추가 버튼을 클릭하면 CascaderMultiple 컴포넌트 하단에 ^[2]선택한 데이터가 리스트업 된다.

...

사용자가 데이터를 선택 할 때 마다 입력필드에 선택한 데이터를 출력해주는 기능이다. 만약 Change on select{OFF} 로 설정하면, child가 없는 leaf data를 선택 할 때에만 입력필드에 데이터가 출력된다.

❗️Use validation for Item depth와 같이 사용 불가능

...