vue中使用阿里字体图标库

本文基于pink老师和哈默老师的总结

下文的div换成span（或者其他行内标签如i）标签，我就不改了

1.首先进入阿里图标库，并且搜索对应的字体图标加入到购物车，之后添加到项目里（项目需要提前创建或者添加时创建）

2.删除demo文件并且将文件引入到main.js中

3.使用字体图标库的两种方式

3.1引入类名（推荐）

  3.2使用content

如果你直接从css文件复制content会缺少几个符号

4.优化代码（只使用第一种引入）

第二个是为了防止出现class="test icon-dianzan"的情况

但是我感觉一下代码一样可以（可能容错不是很好）

 5.字体图标小技巧(扩大字体图标点击范围)

 

其实直接加入padding更方便一点