如何使用React Component在UI中显示svg图标(.svg文件)?
我已经看到很多用于svg的svg库,但是没有一个给我如何在react组件中导入.svg的代码,我已经看到了谈论将svg代码引入反应而不是使用.svg图标作为图像的代码并显示在用户界面中.
I have seen lot libraries for svg on react but none gave me how to import a .svg in the react component , I have seen code which talk about bring the svg code in to react rather than using the .svg icon as image and show it in the UI .
请告诉我是否有嵌入图标的方法.
Please let me know if there are ways to embed the icon .
如果图像是远程托管的,则可以直接将.svg
扩展名与img
标记一起使用.
You can directly use .svg
extension with img
tag if the image is remotely hosted.
ReactDOM.render(
<img src={"http://s.cdpn.io/3/kiwi.svg"}/>,
document.getElementById('root')
);
这是小提琴: http://codepen.io/srinivasdamam- 1471688843/pen/ZLNYdy?editors = 0110
注意:如果您正在使用任何Web应用程序捆绑程序(例如Webpack),则需要具有相关的文件加载器.
Note: If you are using any web app bundlers (like Webpack) you need to have related file loader.