我通过 index.jsx 从“icons”文件夹中导入所有 SVG,如下所示:
索引.jsx:
export about from './about.svg';
Run Code Online (Sandbox Code Playgroud)
这是导入:Button.jsx
import React from 'react';
import './MenuIcon.scss';
import * as IconID from './icons';
const Button = (props) => {
return (
<div className="menu-icon" >
<div className={'menu-icon__icon-wrapper'}>
<IconID.about /> // This works great
<IconID['about'] /> // This does not work
</div>
</div>
);
};
export default Button;
Run Code Online (Sandbox Code Playgroud)
现在要获取特定的 Svg,例如我只需调用返回方法,一切正常。
现在我想加载不同的 SVG,例如:
const svgName = 'back';
return (<IconId['back'] />);
Run Code Online (Sandbox Code Playgroud)
我怎样才能使这成为可能?