React+TypeScript下如何移除MUI TablePagination的行数显示文本？

在React+TypeScript项目中，想要移除TablePagination组件里的目标文本，直接给labelDisplayedRows属性传入一个返回空字符串的函数即可。该属性接收的函数负责生成要显示的文本内容，返回空就不会渲染任何对应文本。

代码示例 #

import TablePagination from '@mui/material/TablePagination';

// 组件内使用示例
<TablePagination
  count={totalDataCount}
  page={currentPage}
  rowsPerPage={pageSize}
  onPageChange={handlePageSwitch}
  onRowsPerPageChange={handlePageSizeChange}
  // 传入返回空字符串的函数，移除目标文本
  labelDisplayedRows={() => ''}
/>

如果之后需要自定义显示内容，也可以利用函数参数{ count, page, rowsPerPage, from, to }生成自定义文本，比如：

labelDisplayedRows={({ from, to, count }) => `${from}-${to} / ${count}`}

内容的提问来源于stack exchange，提问作者menab