vue3+element-plus里prefix-icon图标使用不显示的问题

问题描述:

今天在写项目登录的时候,需要在账号/密码处加上icon图标,但是引用完element-plus/icons之后,还是不行,不显示icon图标。后面发现,当前版本的emement-plus的icon图标不能直接使用了,需要以引用组件的方式引用,而且不能全局引用,只能单独引用,比如说使用user的icon图标,需要 app.component(“user”,user)这样引用之后,再使用prefix-icon="user"下面说下如何不单独引用icon。

main.js里面统一注册icon

// 统一导入el-icon图标
import * as ElIconModules from '@element-plus/icons'

// 统一注册el-icon图标
for(let iconName in ElIconModules){
  app.component(iconName,ElIconModules[iconName])
}

在这里插入图片描述


ok,这样的话就可以直接使用在vue组件里使用icon图标了,需要注意的是新的icon图标名称变了,比如 user的icon图标,之前是el-icon-user现在是直接使用user,具体可以参考element-plus的官方文档

  • 15
    点赞
  • 24
    收藏
    觉得还不错? 一键收藏
  • 13
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 13
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值