页面中的 MUIDataTable 默认行不起作用

【问题标题】：MUIDataTable default rows in page doesn't work页面中的 MUIDataTable 默认行不起作用
【发布时间】：2020-06-15 17:21:53
【问题描述】：

我正在尝试自定义 MUIDataTable 中的行数，但似乎默认值始终保持在 10。这是我尝试过的：

  <MUIDataTable
      pagination="true"
      count="5"
      title={"Proposals"}
      data={data.hits}
      columns={columns}
    />

我也尝试添加page="1"，但似乎没有效果。我该如何解决这个问题？

【问题讨论】：

【解决方案1】：

参考 MUI-Datatables 的document

您需要在表格的 options 属性中提供它

<MUIDataTable
  options={{
    count: 10,
    ...
  }}
  ...
/>

count 适合您的需求，page 用于其他功能

page：用户提供的分页起始页
count：用户提供的总行数覆盖

顺便说一下，你可以通过添加两个相关的props来实现具体的分页，

rowsPerPage：每页允许的行数
rowsPerPageOptions：在分页中提供用户可以选择的行数的选项

使用示例如下：

<MUIDataTable
  options={{
    rowsPerPage: 20,
    rowsPerPageOptions: [10, 15, 20],
    ...
  }}
  ...
/>

【讨论】：