材质 UI 材质表 TablePagination 问题。 （反应）

Question

我正在使用材料表。 TablePagination 不起作用。它在控制台中引发错误。

我尝试按照文档安装软件包。

https://material-table.com/#/docs/install

npm install material-table --save
npm install @material-ui/core --save



 Material-UI: The key `caption` provided to the classes prop is not implemented in ForwardRef(TablePagination).
    You can only override one of the following: root,toolbar,spacer,selectLabel,selectRoot,select,selectIcon,input,menuItem,displayedRows,actions.

Warning: Failed prop type: The prop `onPageChange` is marked as required in `ForwardRef(TablePagination)`, but its value is `undefined`.

Warning: Unknown event handler property `onChangePage`. It will be ignored.

Warning: Unknown event handler property `onChangeRowsPerPage`. It will be ignored.

versions:

"@material-ui/core": "^5.0.0-alpha.24",
"material-table": "^1.69.2",

如果我尝试分页，它会在控制台中引发错误。

Uncaught TypeError: _this.props.onChangePage is not a function

示例代码：

                 <MaterialTable
                  icons={tableIcons}
                  columns={columns}
                  data={editable}
                  title="Orders"
                  localization={{
                    toolbar: {
                      searchPlaceholder: 'Filter',
                      searchTooltip: 'filters the given text'
                    },
                    header: {
                      actions: 'Actions'
                    }
                  }}
                  actions={[
                    {
                      icon: 'save',
                      tooltip: 'Save User',
                      onClick: (event, rowData) =>
                        alert('You saved ' + rowData.name)
                    }
                  ]}
                  options={{
                    actionsColumnIndex: -1,
                    selection: true,
                    exportButton: true,
                    showFirstLastPageButtons: true,
                    pageSize: 5,
                    padding: 'dense',
                    pageSizeOptions: [5, 20, 50]
                  }}
                />

Answer 1

我遇到了同样的问题。对我来说，这是由于 @material/core@4.12.1 的最新版本引起的，由于 TablePagination 中的方法已被弃用。由于 material-table 使用了这个并且没有升级这些不推荐使用的方法，所以它会抛出错误。

我能够通过将 @material-ui/core 版本降级为 4.11.4 并将 material-table 版本保持为 1.69.3 来解决此问题。另一方面，正如@knock-out 所提到的。您可以创建自己的材料表组件。只需更改 -version

希望对您有所帮助！