使用svg作为react组件
使用svg作为react组件
提问于 2020-06-20 07:10:09
我正在尝试使用带有react的SVG，但我不能。我尝试了一些解决方案，结果我找不到为什么会出现这个错误：
InvalidCharacterError
Failed to execute 'createElement' on 'Document': The tag name provided ('<svg>
<g transform="translate(0.000000,227.000000) scale(0.100000,-0.100000)"
fill="#000000" stroke="none">
<如果有任何人能帮助我，我将非常感激。codesandbox中的代码示例：https://codesandbox.io/s/svg-in-react-r3g6l?file=/index.js
回答 3
Stack Overflow用户
回答已采纳
发布于 2020-06-20 08:13:46
这是我通常做的事情：
访问https://react-svgr.com/playground/并粘贴到您的SVG中，它会将SVG转换为React组件。它允许您将SVG属性作为道具进行传递。
您可以查看它的原始库- svgr，以获得其他用途。
Stack Overflow用户
发布于 2020-06-20 07:21:49
您应该使用img标记
import Logo from "./Logo.svg
<img src={Logo} alt="Logo" />Stack Overflow用户
发布于 2020-06-20 07:48:32
“作为新版本create- React -app (v2)新增功能的一部分，我们现在可以将SVG作为React组件导入。”
有关更多选项，请查看本文：using-svg-icons-components-in-react
*编辑:要更改svg的颜色，请使用CSS中的“fill”属性。您可以在svg中添加id或class来选择它。
fill: red;页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/62479743
复制相关文章
相似问题
腾讯云开发者
