React Redux图标显示

时间:2018-10-01 18:38:35

标签: reactjs react-redux

在React应用程序中,我需要确保图标显示在三个类别中。例如,构建图标,主页图标和工作图标。当前,某些图标混杂在不同的类别中。     请检查下面的代码,看看我们是否可以使用JSX创建一个循环来显示图标。

     {/* Icon */}
         {(type !== 'button') &&
           <OurtemIcon color="inherit">
             <Icon icon={type} defaultIcon="TypeOne"/>
           </ourItemIcon>
         }

        const iconComponent = { ...icin.jsx
          TypeOne: ContentCopy,
          TypeTwo: Computer,
          TypeThree: Build,
        }
   //...............................
    const sanitize = icon => icon && icon.replace('-', '');
    const Icon = ({ icon, defaultIcon, ...other }) => {
      const Component = iconComponent[sanitize(icon)] || 
    iconComponent[sanitize(defaultIcon)];
      return Component ? <Component {...other} /> : null;
    };

    export default Icon;

感谢您的输入。

0 个答案:

没有答案