element 如何使用自定义icon图标_elementuiicon图标自定义

element 自定义 icon图标

在使用element icon组件时，有时候会遇到几个组件库里没有的icon图标，是可以自定义来进行载入的。

一， 我们可以在iconfont中搜索我们想自定义的icon图标

二， 首先需要登陆iconfont 我一般用微博登陆 登陆完成后搜索你想要的图标 选中我们想要的图标，点击图片中类似于购物车的图标，添加入库

三、点击箭头所指的位置

会弹出这个窗口 点击添加至项目

点击添加新项目 会让你输入项目名称 输入完后 点击确认就好

会自动给跳入此页面

点击图中箭头所指的编辑项目

修改 elementUI 的前缀是 el-icon Font Family是 element-icons

修改完成后点击保存 选择下载到本地

下载完成后会是一个压缩包 解压至你要用此图标的项目文件夹

下一步需要在main.js中引入此文件夹中的iconfont.css

最后在需要在iconfont中选中Font class 然后复制这个图标名进行使用

至此大功告成