데이터 그리드는 정렬, 필터링, 페이지 나누기, 편집을 지원하는 네이티브 표입니다. columns를 정의하고 rows를 전달하면 각 셀이 타입에 따라 로케일에 맞는 서식으로 표시됩니다. 숫자, 통화, 날짜, 예/아니요, enum 값의 레이블을 지원합니다.
상태는 바인딩하고, 저장하고, 서버로 보낼 수 있는 모델에 담깁니다. 모델은 sort, filters, search, page, selected, 그리고 사용자가 정한 열 너비, 순서, 고정, 숨김을 담는 columnState입니다. 페이지를 나누지 않으면 보이는 행만 렌더링하므로, 10만 행도 10행처럼 스크롤됩니다.
모든 셀에 키보드로 이동할 수 있으며, 각 열의 패널에서는 그 열을 정렬, 필터링, 고정, 이동하거나 너비를 맞추거나 숨길 수 있습니다.
검색, 정렬, 페이지 나누기
입력하면 모든 열을 검색합니다. 헤더를 클릭하면 정렬하고, Shift 키를 누른 채 클릭하면 두 번째 열을 정렬에 추가합니다. nuiGridCell이 상태를 그리고, exportCsv()는 표시된 내용을 내보냅니다.
선택
selection="multiple"은 체크박스를 추가하고 선택된 행의 키를 바인딩합니다. Shift 키를 누른 채 클릭하면 범위를 선택하고, 헤더의 체크박스는 필터 조건에 맞는 모든 행을 선택합니다.
편집
셀을 더블클릭하거나, Enter 키를 누르거나, 그냥 입력해 보십시오. validate는 메시지와 함께 편집기를 열어 둡니다. 확정된 편집은 rows를 갱신하고 cellEdit를 내보냅니다.
10만 행
페이지를 나누지 않으면 보이는 행만 렌더링합니다. 고정된 열은 가장자리에 머물며, columnState는 사용자가 만든 레이아웃을 유지합니다.
서버 데이터
server 모드에서는 그리드가 받은 행을 그대로 표시하고, 변경될 때마다 queryChange로 알립니다. 데이터를 가져오는 동안에는 loading을 설정합니다.