首页 > 其他分享 >vue3 全局注册icon 《 Ant Design Vue》

vue3 全局注册icon 《 Ant Design Vue》

时间:2023-02-10 16:22:34浏览次数:49  
标签:ant Vue icons Ant Design key 组件 design antIcons

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  ===>组件名

 

标签:ant,Vue,icons,Ant,Design,key,组件,design,antIcons
From: https://www.cnblogs.com/ccad/p/17109374.html

相关文章