TNBLOG
首页
博客
视频
资源
问答
猿趣
手机
关于
搜索
收藏
便签
笔记
消息
创作
登录
剑轩
故如虹,知恩;故如月,知明
博主信息
排名
6
文章
6
粉丝
16
评论
8
文章类别
CSS
15篇
微服务
41篇
Git
14篇
.NET
102篇
移动开发
33篇
软件架构
23篇
.NET Core
119篇
.NET MVC
11篇
英语
3篇
随笔
86篇
Bootstrap
3篇
Redis
21篇
编辑器
10篇
Js相关
15篇
虚拟化
8篇
更多
Oracle
7篇
Python
14篇
数据库
26篇
EF
17篇
微信
3篇
前端
151篇
消息队列
6篇
docker
41篇
多线程
1篇
Java
4篇
软件基础
2篇
C++
2篇
WCF
7篇
Linux
7篇
nginx
5篇
K8S
9篇
ABP
2篇
最新文章
最新评价
{{item.articleTitle}}
{{item.blogName}}
:
{{item.content}}
关于我们
ICP备案 :
渝ICP备18016597号-1
网站信息:
2018-2024
TNBLOG.NET
技术交流:
群号656732739
联系我们:
contact@tnblog.net
欢迎加群
欢迎加群交流技术
原
vue element admin 使用svg图标
1135
人阅读
2020/6/7 12:58
总访问:
3968240
评论:
0
收藏:
0
手机
分类:
前端
vue-element-admin基础模板中,已经封装好了使用svg图标的组件,所在路径为:src/icons/svg(有些模板是在src/svg下面,看情况找到对应存放的文件夹就行),在其中我们可以找到相关的代码,所有在文件夹中的svg图片注册到全局中,可以在项目中任意地方使用。所以图标均可在 @/icons/svg。可自行添加或者删除图标,所以图标都会被自动导入,无需手动操作。 ![](https://img.tnblog.net/arcimg/aojiancc2/ba5ac2625798444b8e42872318dc700c.png) 使用的时候直接使用svg-icon组件加样式名就行了,样式名就是那个图标名,代码如下: ``` <svg-icon icon-class="bell1" /> <svg-icon :icon-class="isFullscreen?'exit-fullscreen':'fullscreen'" @click="click" /> ``` 需要什么图标在vue-element-admin基础模板中没有的情况下,可以去阿里巴巴图标库去下载svg图标。svg图标还可以在阿里巴巴图标库复制svg代码后创建一个.svg后缀的文件把复制的svg代码粘贴进去使用
欢迎加群讨论技术,1群:677373950(满了,可以加,但通过不了),2群:656732739
👈{{preArticle.title}}
👉{{nextArticle.title}}
评价
{{titleitem}}
{{titleitem}}
{{item.content}}
{{titleitem}}
{{titleitem}}
{{item.content}}