1

jeecgboot版本2.0
ant-design-vue版本1.5.2
图标项目创建部分内容可参考官方技术文档地址 http://doc.jeecg.com/1273896http://jeecg-boot.mydoc.io/?t=345699
使用symbol 方式来实现自定义图标
修改VUE中/src/components/menu/index.js文件

import Icon from 'ant-design-vue/es/icon'
const { Item, SubMenu } = Menu

改为

import Icon from 'ant-design-vue/es/icon'
// 此处修改
const MyIcon = Icon.createFromIconfontCN({
  scriptUrl: '//at.alicdn.com/t/font_1861207_dq8n42tqgnd.js', // 在 iconfont.cn 上生成
});
const { Item, SubMenu } = Menu

    renderIcon (icon) {
      if (icon === 'none' || icon === undefined) {
        return null
      }
      const props = {}
      typeof (icon) === 'object' ? props.component = icon : props.type = icon
      return (
        <Icon {... { props } }/>
      )
    }

改为


    renderIcon (icon) {
      if (icon === 'none' || icon === undefined) {
        return null
      }
      const props = {}
      typeof (icon) === 'object' ? props.component = icon : props.type = icon
      // 此处修改
      return (
        <MyIcon {... { props } }/>
      )
    }

image.png
按照项目内的名称修改图标
image.png


渔人泛舟
1 声望0 粉丝

自由的程序工作者