点击——>阿里巴巴矢量图标库官网
登录
将图片添加入库
购物车中查看，添加至项目
下载至本地，解压文件夹
文件夹中含有以下文件
将此文件夹重命名并放入项目文件-src-assets文件夹中
在main.js中导入图标库的css文件
import './assets/yonghu/iconfont.css'
复制图标名字，使用element-ui插入
prefix-icon前置图标，添加固定类iconfont，以及复制下来的图标代码名称icon-yonghu
<!-- 登录表单区域 --><el-form label-width="0px" class="login_form"><!-- 用户名 --><el-form-item> <el-input prefix-icon="iconfont icon-yonghu"></el-input> </el-form-item><!-- 密码 --><el-form-item><el-input prefix-icon="iconfont icon-mima"></el-input></el-form-item><!-- 按钮区域 --><el-form-item class="btns"><el-button type="primary">登录</el-button><el-button type="info">重置</el-button></el-form-item></el-form>
效果
如果觉得《vue lic在element-ui中使用阿里巴巴矢量图标库iconfont图标》对你有帮助，请点赞、收藏，并留下你的观点哦！
