如何在React-Admin中让创建按钮始终显示‘+’图标？

要让创建按钮始终显示“+”图标，你需要替换React Admin默认的响应式CreateButton，通过自定义组件或修改List的actions属性实现：

方法1：自定义List的Actions组件 #

在你的MenuItems组件中，手动指定List的actions属性，使用带“+”图标的按钮替代默认的CreateButton：

// 导入所需组件
import { List, IconButton, useNavigate } from 'react-admin';
import AddIcon from '@mui/icons-material/Add';

export const MenuItems = () => {
  const navigate = useNavigate();
  
  // 自定义创建按钮，始终显示+图标
  const CustomCreateButton = () => (
    <IconButton 
      color="primary" 
      onClick={() => navigate('/seller/create')}
    >
      <AddIcon />
    </IconButton>
  );

  return (
    <List actions={<CustomCreateButton />}>
      {/* 这里保留你原本的List内容（比如Datagrid等） */}
    </List>
  );
};

方法2：覆盖默认CreateButton的内容 #

如果你想继续使用React Admin的CreateButton组件，只需强制传入图标作为子元素，覆盖默认的响应式文字：

import { List, CreateButton } from 'react-admin';
import AddIcon from '@mui/icons-material/Add';

export const MenuItems = () => {
  return (
    <List 
      actions={
        <CreateButton>
          <AddIcon /> {/* 强制显示图标，替代默认的响应式文字 */}
        </CreateButton>
      }
    >
      {/* 原本的List内容 */}
    </List>
  );
};

方法3：CSS强制隐藏文字（不推荐） #

如果不想修改组件代码，可以通过CSS隐藏按钮的文字部分，只保留图标：

/* 全局样式或组件内样式 */
.ra-create-button .MuiButton-label span {
  display: none !important;
}

注意：这种方式依赖React Admin和Material UI的类名，后续版本更新可能失效，优先推荐前两种组件自定义的方式。

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