如何动态加载material-ci-icons图标

n0t*_*ace 5 node.js reactjs redux material-ui

我使用Material-ui@nextmaterial-ui-next@next

material-ui@next加载一个图标用法:

import AddIcon from 'material-ui-icons/AddIcon';
function AddIconButton(props) {
    return (
        <AddIcon />
    );
}
Run Code Online (Sandbox Code Playgroud)

但我想动态加载material-ci-icons图标

例如,我有可变菜单

const menus = [
  {
    Name: 'menu1',
    Icons: 'face',
  },
  {
    Name: 'menu2',
    Icon: 'extension',
  }
].
Run Code Online (Sandbox Code Playgroud)

如何根据菜单在页面上显示图标

小智 0

我也面临这个问题。我使用此链接: 动态加载图标。将我的菜单图标名称保存在数据库中并使用, <Icon>{props.iconName}</Icon>但是它对我不起作用。因为我没有太多时间,所以我只是将材质 ui 图标的 SVG 格式保存在我的数据库中,然后在我的 JSX 中恢复它。

我从 Material ui 图标网页的浏览器元素检查中获得了 SVG 格式的图标