若依前端引入外部icon

若依前端引入外部icon

场景:使用若依管理平台时,element-ui自带icon不满足需求,需要自己引入

具体实现:

  1. 下载自己需要的svg文件,推荐下载地址: https:www.iconfont.cn,下载时选择SVG下载
  2. 将下载的svg文件引入项目中(src/assets/icons/svg文件夹下)
  3. 在需要使用的vue文件中使用:
javascript 复制代码
<svg-icon icon-class="bookmark" class-name='custom-class'/>

.custom-class{
    color: #C03639;
    font-size: 40px;
  }

说明:bookmark为svg文件名,custom-class为自定义样式,若样式不生效,将svg文件中的fill参数删除或者改为fill="currentColor"即可

相关推荐
摸鱼的春哥15 分钟前
春哥的Agent通关秘籍07:5分钟实现文件归类助手【实战】
前端·javascript·后端
念念不忘 必有回响18 分钟前
viepress:vue组件展示和源码功能
前端·javascript·vue.js
C澒24 分钟前
多场景多角色前端架构方案:基于页面协议化与模块标准化的通用能力沉淀
前端·架构·系统架构·前端框架
崔庆才丨静觅25 分钟前
稳定好用的 ADSL 拨号代理,就这家了!
前端
江湖有缘27 分钟前
Docker部署music-tag-web音乐标签编辑器
前端·docker·编辑器
恋猫de小郭2 小时前
Flutter Zero 是什么?它的出现有什么意义?为什么你需要了解下?
android·前端·flutter
崔庆才丨静觅8 小时前
hCaptcha 验证码图像识别 API 对接教程
前端
passerby60619 小时前
完成前端时间处理的另一块版图
前端·github·web components
掘了9 小时前
「2025 年终总结」在所有失去的人中,我最怀念我自己
前端·后端·年终总结
崔庆才丨静觅9 小时前
实用免费的 Short URL 短链接 API 对接说明
前端