material-table 覆盖导致警告的分页组件

Question

enter code here我正在尝试覆盖 material-table 中的分页组件。我添加的功能运行良好 - 但是我在下面给出的 console.The 警告中收到警告。

Material-UI: The key selectRoot provided to the classes prop is not implemented in MTablePaginationInner. You can only override one of the following: root.

Material-UI: The key caption provided to the classes prop is not implemented in MTablePaginationInner. You can only override one of the following: root

这里是素材的代码片段-uitable

        <MaterialTable 
            columns={columns} 
            data={invoices} 
            icons={IconsForMaterialTable}
            options={{ paging:true}}
            components={{
                Pagination: (subProps) => {
                    return <Box display="flex" justifyContent="flex-end"> <Box width="260px" justifyContent="flex-end">
                        <MTablePagination {...subProps} count={pageCount} onChangePage={(e, page) => setPage(page)} page={page} rowsPerPage={rowsPerPage}/>
                    </Box></Box>
                }}}
        />

Answer 1

您看到的警告告诉您正在将名为 classes 的道具传递给 MTablePagination 组件，并且 classes 对象如下所示，例如：

const classes = {
  root: "some_class_name",
  selectRoot: "another_class_name",
  caption: "one_more_class_name"
}

但 MTablePagination 不是使用少数类属性，如 selectRoot 和 caption，但仅使用 root 属性（可以在源代码中看到）。

因此，您可以安全地忽略这些警告或编写类似这样的内容来删除它：

components={{
  Pagination: (subProps) => {
      return <Box display="flex" justifyContent="flex-end"> <Box width="260px" justifyContent="flex-end">
          <MTablePagination {...subProps} classes={{root: subProps.classes.root}} /* Rest of the code, removed for brevity.*/ />
      </Box></Box>
  }}}
                                           ^^^^ Passing classes

material-table 覆盖导致警告的分页组件

material-table overriding pagination component causing warnings

reactjs

material-ui

material-table