登录.iconfont.cn后拿到自己想用的icon,然后点symboa,把icon的代码生成后,找到ant design pro项目中的src下的defaultSettings.js,设置iconfontUrl的路径,然后就能在router.js文件中更改自己的icon名字了
图标Icon - Ant Design 找到图标的data-icon属性,如下图 放大一点 将data-icon的内容替换到Ant Design Pro 项目菜单中的icon值即可 图标愉快的显示出来了
Ant Design Pro 官方文档说明 在菜单中使用自定义的 icon 由于umi 的限制,在 router.config.js 是不能直接只是用组件的,Pro 中暂时支持 使用 ant.design 本身的 icon type,和传入一个 img 的 url。只需要直接在 icon 属性上配置即可,如果是个 url,Pro 会自动处理为一个 img 标签。 如果这样还不能满足需求...
今天正好要更换ant design pro菜单的图标, 发现使用/xxx/xxx的路径, ant design pro工程会认为不是有效的url地址 需要更换成http://xxx的完整路径 如下面: //数据统计{path:'/dashboard',icon:'/favicon.svg',name:'Dashboard',component:'./equipments.dashboard/DashBoard',}, ps 同事更换的过程中以为svg...
antdesignpro 全局有默认的loading样式icon,比如dva处理数据请求时的默认loading图。如何一次性快速更改默认的loading?比如我想换个loading图标? 💻 示例代码 import { PageLoading } from '@ant-design/pro-layout'; 🚑 其他信息 github-actionsbotcommentedAug 27, 2021 ...
Antd 升级的4.0 版本以后也对icon的生成方式做了修改 image 官方给了相应的插件修复这问题 image 这种插件的方式在config.ts中配置的静态菜单是没问题的,但如果是后台传入的动态菜单这种方式并没有效果.调试发现 umi-plugin-antd-icon-config只在初始化的时候运行一次,为了解决动态菜单的icon加载问题,决定从插件入手,...
这样理论性的东西就梳理完成了,下面我们参考ant-design-pro具体看一下代码中菜单和路由的配置。 菜单配置(menu.js): import { isUrl } from '../utils/index' const initMenuData = [ { name: '主页', key: 'home', icon: 'table', path: 'home' ...
浅谈AntDesignPro菜单⾃定义icon Ant Design Pro 官⽅⽂档说明 由于 umi 的限制，在 router.config.js 是不能直接只是⽤组件的，Pro 中暂时⽀持使⽤本⾝的 icon type，和传⼊⼀个 img 的 url。只需要直接在 icon 属性上配置即可，如果是个 url，Pro 会⾃动处理为⼀ 个 img 标签。如果...
// 如需修改IconMap名称,应该定义、使用一并修改 const IconMap = { dashboard: <Dashboard* />, // 在此处添加icon组件即可 } 1. 2. 3. 4. 5. 6. 运行说明 1、除了正常ant design pro项目运行配置外,按要求修改config/define.ts文件中的APPID和APP_NAME等。
初探ant design pro 1.增加路由子页面&配置菜单 因为ant design pro采取的是umi路由配置,所以只要在对应的文件夹下新建相关的文件夹以及文件,它会自动解析。按照如下的步骤做即可 PS.如果想要给菜单配置icon,ant design pro有一些通用的icon图标,可以在上面配置路由的时候在每个路由处都加上 icon:'iconname' 即可,...