React 그리드 선택
Ignite UI for React 단일 또는 다중 행 및 셀 선택을 지원합니다.
React Grid Selection Example
개요
React 데이터 그리드의 선택은 행 및 셀 수준에서 활성화되며 React 그리드의 selectionMode
옵션을 사용하여 구성할 수 있습니다. 이 속성에는 아래에 나열된 다섯 가지 옵션이 있습니다.
None
: 선택이 활성화되지 않습니다.SingleCell
: 단일 셀 선택이 가능합니다.SingleRow
: 단일 행 선택이 활성화됩니다.MultipleCell
: 여러 셀을 선택할 수 있습니다.MultipleRow
: 여러 행을 선택할 수 있습니다.RangeCell
: 클릭 및 드래그를 통해 여러 셀 범위를 선택할 수 있습니다.
selectionBehavior
기본값은 ModifierBased
로, 한 번에 하나의 행이나 셀만 선택되고 항목을 다중 선택하려면 수정자 키(CTRL)가 필요합니다. selectionBehavior
Toggle
로 설정하면 한 번의 클릭으로만 여러 행이나 셀을 선택할 수 있습니다.
MultipleRow
다음 기능이 포함되어 있습니다.
- 행을 선택하려면 클릭하고 드래그하세요.
- 여러 행을 선택하려면 Shift 키를 누른 채 클릭하세요.
- 여러 행을 선택하려면 Shift 키를 누른 채 위쪽/아래쪽 화살표 키를 누르세요.
스페이스바를 누르면 MultipleRow
또는 SingleRow
통해 활성 행 선택이 전환됩니다.
Row Range Selection
다음 예에서는 그리드의 모든 행을 선택하거나 선택 취소하는 방법을 보여줍니다. selectionMode
MultipleRow로 설정되어야 합니다.
API References
ModifierBased
MultipleCell
MultipleRow
RangeCell
selectionBehavior
selectionMode
SingleCell
SingleRow