vue3 全局注册icon 《 Ant Design Vue》

1、安装 @ant-design/icons-vue 图标组件包(注意:在引入图标组件前必须引入了 ant-design ui组件库)
npm install --save @ant-design/icons-vue

2、在man.ts/js中引入

//导入组件库
import  * as antIcon  from '@ant-design/icons-vue'
let antIcons: any = antIcon;
// 注册组件
Object.keys(antIcons).forEach(key => {
    app.component(key, antIcons[key])
})
// 添加到全局
app.config.globalProperties.$antIcons = antIcons

3、在组件中使用

<component :is="proxy.$antIcons[item.icon]" />
//item.icon  ===>组件名

 

posted @ 2023-02-10 16:12  kai·james  阅读(1291)  评论(0)    收藏  举报