React：导入动态SVG

Question

我想根据我的Branding变量导入另一组SVG图标。 我尝试这样的事情：

import { BRANDING } from 'BrandingBuilder';
import {`${BRANDING}-icons.svg`};

但是我知道React不支持导入{variable}。有解决方法吗？

Answer 1

根据React Docs：

  

您可以   也可以直接将SVG导入为React组件。您可以使用   两种方法。在您的代码中，它看起来像这样：

import { BRANDING } from 'BrandingBuilder';
import { ReactComponent as Logo } from `${BRANDING}-icons.svg`;
const App = () => (
  <div>
    {/* Logo is an actual React component */}
    <Logo />
  </div>
);