vue移动端ui框架vant如何自定义引入阿里巴巴图标库

vant如何自定义引入阿里巴巴图标库

    框架虽然本身有提供部分icon，但是很多时候都无法满足我们得需要，这个时候我们就需要自定义引入icon，这里我是使用的阿里巴巴图标库。

1. 首先，我们先打开阿里巴巴图标库地址，下载我们项目里的图标资源。
   下载完的目录如下：

2. 在项目src/assets路径下新建一个文件夹iconfont(文件名随意取),将下载好的文件放在iconfont目录下。

3. 打开iconfont.css文件，修改文件内容。
   
   同时在main.js里面引入iconfont.css文件和vant的组件
   

4. 在需要使用图标的页面引入icon组件：
   
   class=“iconfont” class-prefix='icon’这一段是固定写死的，后面的name值就是iconfont.css文件里图标对应的类名。
   最后的页面显示
   可以了