如何修改MUI Data Grid工具栏COLUMNS与Density的标题名称？

在MUI @6.9.1版本的DataGrid中，要修改工具栏里的"COLUMNS"和"Density"文本，直接通过组件的localeText属性覆盖默认配置即可，具体实现如下：

核心思路 #

MUI DataGrid的内置交互文本都支持通过localeText对象自定义，其中：

• columns对应工具栏中的"COLUMNS"标题
• density对应工具栏中的"Density"标题

完整代码示例 #

import { DataGrid, GridToolbar } from '@mui/x-data-grid';

// 自定义文本配置
const customLocaleText = {
  columns: 'MyColumn',
  density: 'MyDensity',
};

export default function CustomToolbarTextGrid() {
  return (
    <DataGrid
      disableColumnMenu
      slots={{ toolbar: GridToolbar }}
      localeText={customLocaleText}
      // 保留你原有的其他配置项...
    />
  );
}

说明 #

• localeText属性仅替换你指定的文本键值对，不会影响DataGrid其他默认文本的显示
• 这种方式是MUI官方推荐的自定义内置文本的标准方案，适配你当前使用的@6.9.1版本

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