转载自: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图标(转)的更多相关文章

  1. vue element-ui中引入第三方icon

    vue element-ui中引入第三方icon 把图标加入项目 设置项目名称,下载项目(项目名称自定义) 解压项目到开发目录 在main.js中全局引入css文件 修改下载下来的项目中的css文件, ...

  2. 分享一个自搭的框架,使用Spring boot+Vue+Element UI

    废弃,新的:https://www.cnblogs.com/hackyo/p/10453243.html 特点:前后端分离,可遵循restful 框架:后端使用Spring boot,整合了aop.a ...

  3. Vue + Element UI 实现权限管理系统

    Vue + Element UI 实现权限管理系统 前端篇(一):搭建开发环境 https://www.cnblogs.com/xifengxiaoma/p/9533018.html

  4. vue + element ui 实现实现动态渲染表格

    前言:之前需要做一个页面,能够通过表名动态渲染出不同的表格,这里记录一下.转载请注明出处:https://www.cnblogs.com/yuxiaole/p/9786326.html 网站地址:我的 ...

  5. vue + element ui 表格自定义表头,提供线上demo

    前言:工作中用到 vue+element ui 的前端框架,需要使用自定义表头,需要使用 re.转载请注明出处:https://www.cnblogs.com/yuxiaole/p/9710826.h ...

  6. vue+element ui 的上传文件使用组件

    前言:工作中用到 vue+element ui 的前端框架,使用到上传文件,则想着封装为组件,达到复用,可扩展.转载请注明出处:https://www.cnblogs.com/yuxiaole/p/9 ...

  7. vue+element ui 的表格列使用组件

    前言:工作中用到 vue+element ui 的前端框架,有这个场景:很多表格的列有许多一样的,所以考虑将列封装为组件.转载请注明出处:https://www.cnblogs.com/yuxiaol ...

  8. vue+element ui 的tab 动态增减,切换时提示用户是否切换

    前言:工作中用到 vue+element ui 的前端框架,动态添加 Tab,删除 Tab,切换 Tab 时提示用户是否切换等,发现 element ui  有一个 bug,这里记录一下如何实现.转载 ...

  9. 基于 vue+element ui 的cdn网站(多页面,都是各种demo)

    前言:这个网站持续更新中...,有网上预览,github上也有源码,喜欢记得star哦,欢迎留言讨论. 网站地址:我的个人vue+element ui demo网站 github地址:yuleGH g ...

  10. vue + element ui 阻止表单输入框回车刷新页面

    问题 在 vue+element ui 中只有一个输入框(el-input)的情况下,回车会提交表单. 解决方案 在 el-form 上加上 @submit.native.prevent 这个则会阻止 ...

随机推荐

  1. SQLI-LABS学习笔记(四)

    第十六关   和之前的关卡一样,修改闭合,无意义的关卡   ")闭合即可   第十七关   这题从源码上看发现     这里进行了两次查询   先查询了用户名是否存在   再查询密码是否匹配 ...

  2. Windows 计划任务 如果选择未登录就运行 则看不到GUI

    You can specify that a task should run even if the account under which the task is scheduled to run ...

  3. 计算机网络 之 Cisco packet tracer 的安装及汉化

    可以去官网下载最新版本的Cisco packet tracer 免费 汉化包及7.1版本百度云链接:链接: https://pan.baidu.com/s/1XudelgnMu6XysCZ36csl7 ...

  4. Linux中的常用快捷键

    tab 命令或路径补全键,linux里面最有用的快捷键,如果tab不到路径或命令,就代表没有这个路径或者命令,还有可能是权限不对 ctrl+c 终止当前任务命令或程序 ctrl+d 退出当前用户环境, ...

  5. 配置IIS5.5/6.0 支持 Silverlight

    在安装完Silverlight1.1 Alpha后,要使自己的IIS服务器支持Silverlight的浏览还需要配置一下IIS网站的 Http头->MIME映射添加内容如下:扩展名        ...

  6. Vagrant (二) - 日常操作

    立即上手 上一节中,我们介绍了怎样安装 Vagrant,安装本身并不困难.本章节中我们首先要快速上手,以便获得一个直观的概念: 建立一个工作目录 打开命令行工具,终端工具,或者iTerm2等,建立一个 ...

  7. CentOS7编译安装NodeJS

    概述 在CentOS7下采用编译NodeJS二进制源码包的方式安装NodeJS 下载NodeJS安装包 你可以先下载NodeJS二进制源码安装包文件然后上传到CentOS系统,也可以通过wget命令直 ...

  8. nat和静态映射

    拓扑图: 实验要求: 1.R2.R3能访问外网的4.4.4.4(4.4.4.4为R4上的环回接口,用来模拟inter网). 2.R4访问222.222.222.100其实访问到的是内网的192.168 ...

  9. 关于通过Date.getTime()得到1970年01月1日0点零分问题验证

     public static String getTimestamp_1970() throws Exception {   java.text.SimpleDateFormat formater = ...

  10. Mysql 字符串拆分 OR 一行转多行

    Mysql 字符串拆分 OR 一行转多行 需要了解的的几个mysql 函数: A.substring_index():字符串截取 substring_index(str,delim,count)   ...