Vue Element-UI使用第三方icon图标(转)
转载自:https://www.jianshu.com/p/59dd28f0b9c9
1.打开阿里icon,注册 >登录>图标管理>我的项目
2.新建项目
3. 添加icon到项目中
在图标库中找到想要的icon后,加入购物车,然后点击右上角的购物车,把icon添加到你的项目里吧~
设置fontClass,然后下载到本地
5.下载后进行解压。解压后修改其中iconfont.css文件
注意:el-icon-ali是你之前设置的icon前缀,第二个el-icon-ali前边有空格的
6.上边设置好以后,打开vue项目,在src-assets下创建了icon文件夹,将所有的文件复制了过来
在main.js里边把css引进来
然后重新npm run dev 一下
7.打开在阿里icon的项目,复制你想要的图标代码
使用两种引用方式,跟element自带的使用方法一样
<el-button icon="el-icon-alifresh" size="small" circle @click="updateNum"></el-button>
<i class="el-icon-alifresh"></i>
Vue Element-UI使用第三方icon图标(转)的更多相关文章
- vue element-ui中引入第三方icon
vue element-ui中引入第三方icon 把图标加入项目 设置项目名称,下载项目(项目名称自定义) 解压项目到开发目录 在main.js中全局引入css文件 修改下载下来的项目中的css文件, ...
- 分享一个自搭的框架,使用Spring boot+Vue+Element UI
废弃,新的:https://www.cnblogs.com/hackyo/p/10453243.html 特点:前后端分离,可遵循restful 框架:后端使用Spring boot,整合了aop.a ...
- Vue + Element UI 实现权限管理系统
Vue + Element UI 实现权限管理系统 前端篇(一):搭建开发环境 https://www.cnblogs.com/xifengxiaoma/p/9533018.html
- vue + element ui 实现实现动态渲染表格
前言:之前需要做一个页面,能够通过表名动态渲染出不同的表格,这里记录一下.转载请注明出处:https://www.cnblogs.com/yuxiaole/p/9786326.html 网站地址:我的 ...
- vue + element ui 表格自定义表头,提供线上demo
前言:工作中用到 vue+element ui 的前端框架,需要使用自定义表头,需要使用 re.转载请注明出处:https://www.cnblogs.com/yuxiaole/p/9710826.h ...
- vue+element ui 的上传文件使用组件
前言:工作中用到 vue+element ui 的前端框架,使用到上传文件,则想着封装为组件,达到复用,可扩展.转载请注明出处:https://www.cnblogs.com/yuxiaole/p/9 ...
- vue+element ui 的表格列使用组件
前言:工作中用到 vue+element ui 的前端框架,有这个场景:很多表格的列有许多一样的,所以考虑将列封装为组件.转载请注明出处:https://www.cnblogs.com/yuxiaol ...
- vue+element ui 的tab 动态增减,切换时提示用户是否切换
前言:工作中用到 vue+element ui 的前端框架,动态添加 Tab,删除 Tab,切换 Tab 时提示用户是否切换等,发现 element ui 有一个 bug,这里记录一下如何实现.转载 ...
- 基于 vue+element ui 的cdn网站(多页面,都是各种demo)
前言:这个网站持续更新中...,有网上预览,github上也有源码,喜欢记得star哦,欢迎留言讨论. 网站地址:我的个人vue+element ui demo网站 github地址:yuleGH g ...
- vue + element ui 阻止表单输入框回车刷新页面
问题 在 vue+element ui 中只有一个输入框(el-input)的情况下,回车会提交表单. 解决方案 在 el-form 上加上 @submit.native.prevent 这个则会阻止 ...
随机推荐
- 关于flex弹性布局
http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html
- Zabbix3.4安装部署
Zabbix3.4安装部署 一.系统环境 cat /etc/redhat-release CentOS Linux release 7.3.1611 (Core) 关闭防火墙及selinux sy ...
- MySQL事务与并发
很多程序员都学过MySQL,而且也会写SQL语句.但仅仅会写还远远不够,在面试中以及在工作中,还必须要会事务和并发. 一.事务 事务是满足 ACID 特性的操作,可以通过 Commit 提交事务, ...
- Linux利用sed批量修改文件名
初始文件名 # ls -lh total 5.5G -rw-r--r-- 1 root root 193K Sep 28 09:38 20180908.txt drwxr-xr-x 2 root ro ...
- 《数据分析实战:基于EXCEL和SPSS系列工具的实践》一1.4 数据分析的流程
本节书摘来华章计算机<数据分析实战:基于EXCEL和SPSS系列工具的实践>一书中的第1章 ,第1.4节,纪贺元 著 更多章节内容可以访问云栖社区"华章计算机"公众号查 ...
- CultureInfo 类中需要的【区域性名称】查询
2019独角兽企业重金招聘Python工程师标准>>> 提供有关特定区域性的信息(对于非托管代码开发,则称为"区域设置"). 这些信息包括区域性的名称.书写系统. ...
- centos监控web目录www下的文件是否被黑、挂马的脚本
.检查是否有安装inotify rpm -qa inotify-tools 2.没有先安装epol源 wget -O /etc/yum.repos.d/epel.repo http://mirrors ...
- Jmeter 数据库测试参数化
1.JDBC Request 参数化 方法一.Jmeter 参数化,在 sql query 中使用变量 Jmeter 参数化,使用 csv 参数化 sql query 中使用 ${变量名} 引用 方法 ...
- Java面试题:抽象类和接口的区别
1.abstract class 在 Java 语言中表示的是一种继承关系,一个类只能使用一次继承关系.但是,一个类却可以实现多个interface. 2.在abstract class 中可以有自己 ...
- zabbix分布式安装全过程
项目规划 软件 版本 IP zabbix-server 3.4.15 10.1.10.128 zabbix-proxy 3.4.15 10.1.10.129 zabbix-agent 3.4.15 1 ...