Vue 自定义图标

Vue 自定义图标

因为elementUI提供的icon有很大的局限性，想要放自己定义的图标，需要繁琐的引入并用img标签展示。不能像ElementUI 引入图标那样，支持类似字体的修改样式，大小和颜色。
所以，思考再三，决定简单的介绍下怎么自定义图标。

1. 首先打开阿里巴巴矢量图标库 选择其中一个图标，添加入库，如图
2. 打开右上角，购物车，弹窗，点击添加至项目
3. 确定之后，如图
4. 下载至本地，文件目录
5. 目录包含Demo介绍，在vue项目中，将该解压后的文件放置 根目录下，public文件夹下，或者static文件夹下。版本不一样分不同文件夹。然后在index.html 引入样式
   <link rel="stylesheet" href="static/iconfont/iconfont.css"/>
6. 在vue文件下，引用图标
7. 注意：iconfont一定要写 后面跟 自定义图标名称xxx 前缀icon-xxx