青岛软件培训-Java培训-Python培训学校-万码学堂

2022-05-10 09:23

2022-05-10 09:23 回答了这个问题

(0)

按照ElementPlus官网的示例使用icon并不会显示对应的icon

解决方案是：

首先需要安装icons，使用对应的包管理工具

1	`$ npm install @element-plus/icons-vue`

然后在你的Vue项目中的main.js需要将icon进行注册

可以仅仅注册使用的icon

如下：

import {Timer,Edit} from '@element-plus/icons-vue'

const app = createApp(App);

app.component("Timer",Timer)

app.component("Edit",Edit)

app.use(store).use(router).use(ElementPlus).mount('#app')

如果需要将所有图标都导入，可以：

import * as ElIcons from '@element-plus/icons-vue'

const app = createApp(App);

for (const iconName in ElIcons) {

app.component(iconName,ElIcons[iconName])

}

app.use(store).use(router).use(ElementPlus).mount('#app')

这样在需要显示图标的地方即可：

<el-divider>wanmait.com</el-divider>

<el-icon>

<Timer />

</el-icon>