You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何移除Material-React-Table下方的Hide/Reset等多余按钮?

Material-React-Table移除底部操作按钮问题

项目中集成Material-React-Table后,表格下方默认显示了"Hide all"、"reset order"、"unpin all"、"show all"四个操作按钮,这些按钮不符合业务需求,还占用了不必要的页面空间。

我查阅了Material-React-Table的官方文档,但没找到通过props直接移除这些按钮的说明,想了解是否可以通过自定义表格渲染的方式隐藏它们。另外我也尝试分析过CSS和组件结构,不过没找到直接实现的方法,希望有经验的开发者能提供解决思路。

表格底部按钮截图:
表格底部操作按钮截图

相关代码:

import React, { memo } from "react";
import { MaterialReactTable } from 'material-react-table';
import useTableESSimple from 'components/MRTTable/Hooks/useTableESSimple';
import AllDialogs from 'components/MRTTable/Common/Dialog'
import { tableController } from "hookstate/tableController";
import { SCHEMA } from "./Schema";

function MRTTable({ tableKey, name }) {
  const meta = SCHEMA[name]
  tableKey = tableKey || name // table key should be different if two tables with same name exist in same screen.
  tableController(tableKey).initialize(tableKey, meta);
  const { tableProps, tablePropsState, initialized, classes } = useTableESSimple(tableKey);

  if (!initialized) return null;

  return (
    <div className={classes.table}>
      <MaterialReactTable
        {...tableProps}
        state={{
          ...tablePropsState,
        }}
      />
      <AllDialogs />
    </div>
  );
}

export default memo(MRTTable);

内容的提问来源于stack exchange,提问作者Hafiz Abdullah

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.12 22:36:19