List

Properties

Property	Type	Default	Description
items	Array<object>		표시할 아이템의 배열입니다.
labelField	string	'label'	아이템의 라벨로 사용할 필드 이름입니다.
rowCount	number	0	한 번에 표시할 최대 아이템 개수입니다.
scrollTarget	stringçHTMLElement		외부 스크롤 요소를 지정합니다. 부모 노드만 가능합니다.
draggable	boolean	false	리스트 아이템이 드래그 가능한지 여부를 나타냅니다.
droppable	boolean	false	리스트에 다른 아이템을 드롭할 수 있는지 여부를 나타냅니다.
hookDragMessage	(data: ListItemDragEventData) => string		아이템 드래그 시 표시할 메시지를 반환하는 함수를 정의합니다.
allowMultiple	boolean	false	사용자가 여러 항목을 선택할 수 있는지 여부입니다.
requireSelection	boolean	false	적어도 하나의 아이템이 항상 선택되어야 하는 여부입니다.
valueField	string		선택된 아이템의 값을 결정하는 필드의 이름입니다.
selectedItem	object		선택된 아이템을 정의합니다.
selectedItems	Array<object>		복수 선택된 아이템을 정의합니다.
selectedValue	Array<string>		선택된 아이템의 valueField 속성 값을 정의합니다.

Methods

Method	Parameters	Return Value	Description
scrollToIndex	index: number	void	해당 인덱스 위치로 스크롤합니다. 이미 표시된 경우 스크롤되지 않습니다.
scrollToItem	item: object	void	해당 아이템 위치로 스크롤합니다. 이미 표시된 경우 스크롤되지 않습니다.
invalidate		void	표시 목록의 갱신을 요청합니다.
flush		void	대기 중인 표시 목록 갱신을 즉시 실행합니다.

Events

Event	Type	Description
collection-change	(event: ArrayListEvent<T>) => void	컬렉션 내부의 아이템이 변경되었을 때 발생합니다. (set, add, remove, move, update, reset, refresh)
caret-change	(event: CustomEvent<{value: number; oldValue: number}>) => void	커서 인덱스가 변경되었을 때 발생합니다.
scroll	(event: CustomEvent<{oldLeft: number; oldTop: number; scrollLeft: number; scrollTop: number; trigger: Event}>) => void	스크롤이 변경되었을 때 발생합니다.
item-down	(event: ItemEvent<T>) => void	아이템에 마우스 다운했을 때 발생합니다.
item-up	(event: ItemEvent<T>) => void	아이템에 마우스 업 했을 때 발생합니다.
item-click	(event: ItemEvent<T>) => void	아이템에 마우스 클릭 했을 때 발생합니다.
item-drag-ready	(event: ListItemDragEvent<T>) => void	드래그 준비가 되었을 때 발생합니다.
item-drag-start	(event: ListItemDragEvent<T>) => void	드래그가 시작되었을 때 발생합니다.
item-drag-move	(event: ListItemDragEvent<T>) => void	드래그 중 움직임이 감지될 때마다 발생합니다.
item-drag-over	(event: ListItemDragEvent<T>) => void	드래그 중인 요소가 특정 영역 위에 이동했을 때 발생합니다.
item-drag-out	(event: ListItemDragEvent<T>) => void	드래그 중인 요소가 특정 영역에서 벗어났을 때 발생합니다.
item-drag-enter	(event: ListItemDragEvent<T>) => void	드래그 중인 요소가 드랍 가능한 영역에 들어갔을 때 발생합니다.
item-drag-leave	(event: ListItemDragEvent<T>) => void	드래그 중인 요소가 드랍 가능 영역에서 밖으로 나갔을 때 발생합니다.
item-drag-end	(event: ListItemDragEvent<T>) => void	드래그가 종료되었을 때 발생합니다.
item-drag-cancel	(event: ListItemDragEvent<T>) => void	드래그가 취소되었을 때 발생합니다.
item-drop	(event: ListItemDragEvent<T>) => void	드래그 중인 요소가 드랍되었을 때 발생합니다.
selection-changing	(event: SelectionEvent<T>) => void	아이템이 선택되기 전에 발생합니다. 이벤트 핸들러에서 preventDefault를 호출하여 선택 작업을 취소할 수 있습니다.
selection-change	(event: SelectionEvent<T>) => void	아이템이 선택된 후에 발생합니다.