今天在写组件的时候需要用到下载等图标,我们使用的UI框架为Element Plus,他本身提供了一套常用的图标集合。经过尝试,摸索出使用方法如下:
一、全局引入并注册
//main.js
import * as Icons from '@element-plus/icons-vue';
createApp(App).use(Icons).mount('#app');
二、在组件中按需引入并使用
import { Download } from '@element-plus/icons-vue';
components: { Download }
<el-icon><download /></el-icon>
值得注意的是,使用的时候首字母可以为大写可以为小写,但在引入的时候首字母必须为大写。