React Tree Grid 페이지네이션 개요

    React 트리 그리드의 Ignite UI for React 페이지네이션 기능은 많은 데이터를 유사한 내용을 가진 페이지 연속으로 분할하는 데 사용됩니다. React 그리드 페이지네이션은 사용자 경험과 데이터 상호작용을 향상시킵니다.IgrTreeGrid 페이지네이션은 태그를 정의하여IgrPaginator 별도의 컴포넌트를 통해 격자 트리에 투영하여 구성할 수 있으며, 이는 열을 추가하는 것과 유사합니다. React 테이블과 마찬가지로, React 트리 그리드의 페이지 배치는 사용자 지정 페이지용 템플릿을 지원합니다.

    React Tree Grid Pagination Example

    다음 예시는 페이지네이션을 나타내IgrTreeGrid 며, 페이지당 항목의 사용법과 페이지 전환 가능 옵션을 설명합니다. 사용자는 "마지막 페이지로 이동"과 "첫 페이지로 이동" 버튼을 통해 페이지를 빠르게 탐색IgrTreeGrid 할 수도 있습니다.

    .gridSize {
    --ig-size: var(--ig-size-small);
}

    <IgrTreeGrid className="gridSize" height="500px" width="100%">
    <IgrPaginator perPage={10}>
    </IgrPaginator>
</IgrTreeGrid>

    Usage

    ​IgrPaginator이 컴포넌트는 아래 예시의 컴포넌트와IgrTreeGrid 함께 사용되지만, 페이징 기능이 필요할 경우 다른 컴포넌트와도 함께 사용할 수 있습니다.

    const selectOptions = [5, 15, 20, 50];

<IgrTreeGrid className="gridSize">
    <IgrPaginator perPage={10} page={1} selectOptions={selectOptions}>
    </IgrPaginator>
</IgrTreeGrid>

    Paginator Component Demo

    API References

    Additional Resources

    우리 커뮤니티는 활동적이며 항상 새로운 아이디어를 환영합니다.