ant-design-pro v4 的menu改用自定义icon或iconfont

ant-design中有介绍如何使用阿里巴巴图表库的icon，调用iconfont的 生成的url 封装一下啊。iconfont

如果使用ant-design-pro v2的话：

src/components/SiderMenu/BaseMenu.js 文件中：

import { getMenuMatches } from './SiderMenuUtils';
import { isUrl } from '@/utils/utils';
import styles from './index.less';
import IconFont from '@/components/IconFont';

const { SubMenu } = Menu;
const getIcon = icon => {
  if (typeof icon === 'string') {
    if (isUrl(icon)) {
      return <Icon component={() => <img src={icon} alt="icon" className={styles.icon} />} />;
    }
    return <Icon type={icon} />;
  }
  if (Array.isArray(icon)) {
    return <IconFont type={icon[0]} className={icon[1] || ''} />;
  }
  return icon;
};

如果使用的是ant-design-pro v4的话，菜单栏直接封装好了，只要设置icon=‘icon-你自己的图标’


这样即可直接获取到对应的icon。