如何使用 react 在 Fluent UI Detaillist 中添加分页

Question

我使用此链接创建了示例 https://developer.microsoft.com/en-us/fluentui#/controls/web/detailslist

现在我想在网格中添加分页。请让我知道步骤。

Answer 1

您可以使用import { Pagination } from '@uifabric/experiments';

  <Pagination
        selectedPageIndex={page}
        pageCount={pageCount}
        onPageChange={onPageChange}
        format
        firstPageIconProps={{ iconName: 'DoubleChevronLeft' }}
        previousPageIconProps={{ iconName: 'ChevronLeft' }}
        nextPageIconProps={{ iconName: 'ChevronRight' }}
        lastPageIconProps={{ iconName: 'DoubleChevronRight' }}
    />