reactjs - 在反应中动态呈现svg图标

Question

所以我的前端有大约 40 个 svgs 在单独的文件中，并且我有一个 api 路由，可以根据请求为我提供 svg 的名称，以便我可以导入它，但我不太确定如何在反应中动态导入这些 svgs马上

我试过了，但这意味着如果我在 img 标签中渲染它们，我将无法更改 svgs 的样式

export const renderIcon = ({ name, folder }) => {
  return <img src={`/${folder}/${name}.svg`} alt="" />;
};

有更好的方法吗？

语境：

基本上 name 只是返回 svg 的名称，文件夹只是“大纲”或“填充”，我试图找到一种方法从这个文件返回 svg，但我做不到，所以我尝试使用 img。

标签： reactjssvgecmascript-6