Question

我正在SvgIcon https://material-ui.com/api/svg-icon/的React应用中使用material-ui。文档中的所有示例均为<path d="M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z" />。不知道是什么如何使用此组件从外部文件渲染svg？

我已经查看了该帖子How to use an SVG file in a SvgIcon in Material-UI，但没有给出加载外部文件的答案。

Answer 1

无法使用Path加载外部svg。您应根据github中的answer在<img />内使用<Icon>：

在'@Christos-Lytras' answer there is an example中进行操作

Answer 2

您可以将svg图标导入为react组件，并使用包裹在SvgIcon组件中的该组件：

import { ReactComponent as Car } from './icons/car.svg'
...
<SvgIcon>
  <Car />
</SvgIcon>

如何在material-ui的`SvgIcon`中加载外部svg文件？

2 个答案: