在 Material-UI 中禁用表格分页

问题描述 投票:0回答:2

我将 Material-UI 的 TablePagination 组件与 React 结合使用。

但是这个组件没有

disabled
属性。

我有一个布尔值

loading
值,我想将其用作参数来启用或禁用
TablePagination
中的箭头。

如何达到这样的效果?

我尝试将

disabled
属性传递给
TablePagination
,但它不起作用。

javascript reactjs pagination material-ui
2个回答
9
投票

没有单个

disabled
开关,但您可以像这样设置内部按钮组件的
disabled
属性:

<TablePagination
  SelectProps={{
    disabled: isDisabled
  }}
  backIconButtonProps={
    isDisabled
      ? {
          disabled: isDisabled
        }
      : undefined
  }
  nextIconButtonProps={
    isDisabled
      ? {
          disabled: isDisabled
        }
      : undefined
  }
  {...}
/>

现场演示

Codesandbox Demo


0
投票

上述答案已被弃用。相反,如果您想禁用即下一步按钮,您可以使用以下结构:

  <TablePagination
    slotProps={{
      actions: {
        nextButton: {
          isDisabled
          ? {
            disabled: isDisabled
          }
          : undefined
        },
      },
    }}
  />
© www.soinside.com 2019 - 2024. All rights reserved.