如何移除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
相关产品推荐
相关产品推荐

