如何使用React Component在UI中显示svg图标（.svg文件）？

Question

我已经看到了很多用于svg on
react的库，但是没有一个给我如何在react组件中导入.svg的代码，我已经看到了谈论将svg代码带入反应而不是使用.svg图标作为图像进行显示的代码。在用户界面中。

请告诉我是否有嵌入图标的方法。

Answer 1

如果图像是远程托管的，则可以直接将.svg扩展名与img标记一起使用。

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），则需要具有相关的文件加载器。