It can be expensive both to fetch and to render large numbers of items. If the amount of data you're displaying might be large, you should use either paging or virtualization.
To enable paging, construct an instance of PaginationState and pass it as the grid's
Pagination property. To provide a UI for pagination, you can either use the built-in
Paginator component, or create a custom UI that reads and modifies the
PaginationState instance.
| Argentina | 0 | 1 | 2 |
| Armenia | 0 | 2 | 2 |
| Australia | 17 | 7 | 22 |
| Austria | 1 | 1 | 5 |
| Azerbaijan | 0 | 3 | 4 |
| Bahamas | 2 | 0 | 0 |
| Bahrain | 0 | 1 | 0 |
| Belarus | 1 | 3 | 3 |
| Belgium | 3 | 1 | 3 |
| Bermuda | 1 | 0 | 0 |
That example also shows how you can change the number of items per page dynamically, just by
mutating the PaginationState instance.
You can customize the appearance of Paginator by supplying a SummaryTemplate.
If you want further customization, you can create your own alternative UI that works with
PaginationState. Example:
| Argentina | 0 | 1 | 2 |
| Armenia | 0 | 2 | 2 |
| Australia | 17 | 7 | 22 |
| Austria | 1 | 1 | 5 |
| Azerbaijan | 0 | 3 | 4 |
| Bahamas | 2 | 0 | 0 |
| Bahrain | 0 | 1 | 0 |
| Belarus | 1 | 3 | 3 |
| Belgium | 3 | 1 | 3 |
| Bermuda | 1 | 0 | 0 |