React 그리드 정렬 개요

    Ignite UI for React 단일 열, 다중 열 및 3상태 열 정렬 구성을 사용하여 오름차순 및 내림차순 열 정렬을 지원합니다.

    React Grid Sorting Example

    Code Snippet

    headerClickAction 속성을 사용하여 React 데이터 그리드에서 단일 또는 여러 열을 오름차순 또는 내림차순으로 정렬할 수 있습니다. TriState가 활성화된 경우 열에 적용된 정렬을 제거할 수 있습니다.

    import { HeaderClickAction } from 'igniteui-react-grids';
    
    <IgrDataGrid
        height="100%"
        width="100%"
        headerClickAction={HeaderClickAction.SortByMultipleColumns}
        dataSource={this.data}
        ref={this.onGridRef}/>
    

    Sorting through API

    import { IgrColumnSortDescription } from 'igniteui-react-grids';
    import { ListSortDirection } from 'igniteui-react-core';
    
    public onGridRef(grid: IgrDataGrid) {
        this.grid = grid;
    }
    // ...
    let colSortDesc = new IgrColumnSortDescription();
    colSortDesc.field = "UnitsInStock";
    colSortDesc.sortDirection = ListSortDirection.Descending;
    this.grid.sortDescriptions.add(colSortDesc);
    

    API References