Material UI Material -table TablePagination问题.(反应)

Question

我使用material-table。TablePagination不工作。它在控制台中抛出一个错误。

我尝试按照文档安装包。

https://material-table.com//docs/安装

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

我得到这个错误:

Material-UI:键caption提供给类prop不是在ForwardRef(TablePagination)中实现。你只能覆盖一个

:根，工具栏，分隔符，selectLabel,selectRoot,select,selectIcon,input,menuItem,displayedRows,actions。

警告:失败的道具类型:道具onPageChange标记为在ForwardRef(TablePagination)中是必需的，但是它的值是undefined.

警告:未知事件处理程序属性onChangePage。它将是忽略。

警告:未知事件处理程序属性onChangeRowsPerPage。它将被忽略。

版本:

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

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

Uncaught TypeError: _this.props。onChangePage不是函数

示例代码:

<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来解决这个问题。另一方面，正如@ knockout所提到的。您可以创建自己的材料表组件。只需更改-version

希望这是有帮助的!

Answer 2

对于我来说，我设法通过删除旧的material-ui模块并安装一个新的来解决这个问题

1. npm remove material-table
npm install @material-table/core

然后在代码中替换

import MaterialTable from 'material-table';

import MaterialTable from '@material-table/core';

感谢@Chris Livdahl的回答

Answer 3

我发现材料表存储库没有与最新的材料UI更改保持同步。相反，看看这里的Material -table fork: https://github.com/material-table-core/core，支持材质UI v4，带有"next"v5版本正在开发中。

修改代码很容易适应新的存储库。按照下面的说明操作:https://material-table-core.com/docs