无法加载 Material-UI 个图标

Question

我的图标显示有问题：

这是我的代码：

import SearchIcon from '@material-ui/icons/Search';

<Button variant='contained' className={classes.sendButton}>
    Search
    <img src={SearchIcon} alt='search'/>
</Button>

但是，在 UI 中，它使用默认的 'broken-page' 符号呈现。控制台没有错误。我已经安装了最新的 npm @material-ui/icons=^4.9.1

我无法确定导致此问题的原因。

谢谢

Answer 1

再见，显示 Material UI 图标不需要使用 img 标签。随便写：

import SearchIcon from '@material-ui/icons/Search';

<Button variant='contained' className={classes.sendButton}>
    Search
    <SearchIcon />
</Button>

您应该会在按钮中看到您的图标。

无论如何，我建议你使用 startIcon Button 道具，例如：

<Button
   variant='contained' 
   className={classes.sendButton}
   startIcon={<SearchIcon />}
>
   Search
</Button>

无法加载 Material-UI 个图标

Unable to load Material-UI icons

icons

reactjs

material-ui