在表格中显示页码

Question

我将Material UI table 与Table Pagination 一起使用，我试图将当前页面与3 个前导页面和3 个先前页面一起显示，而不是显示计数。

我将以下内容添加到TablePagination

<TablePagination labelRowsPerPage='' ...OtherSettings />

但我仍然得到相同的结果。如何更改上图中的文本，使其显示页面而不是行数？

Answer 1

就 Material Design 而言，它旨在显示行（如分页部分的 Material Design Table Behaviour 中所述）。

不过，您可以尝试使用TablePagination 组件的labelDisplayedRows 属性来修改默认显示的行文本，而是根据您的行数据显示页数。应该是这样的：

<TablePagination
    ...OtherSettings,
    labelDisplayedRows={() => {
      return `${page}-${Math.floor(rows.length / rowsPerPage)}`;
    }}
/>

此外，working sandbox demo 和 TablePagination 组件的相关道具文档：documentation。