最近在使用 VUE+Electron+ElementUI 做 pc 端應(yīng)用堵未。遇到一個小問題，在此記錄一下盏触。
Element UI 提供了如此優(yōu)秀的控件庫渗蟹，但是我們得根據(jù)自己項目的需求進行圖標替換。這時候問題來了赞辩，我們看下 Element 的代碼吧雌芽。
<template slot="title">
?????<i class="el-icon-location"></i>
?????<span>導(dǎo)航一</span>
?</template>
清楚的看到“el-icon-location”就是這個圖標的控制入口，初次接觸用 class 來控制圖標的方式辨嗽，不免覺得困惑世落。這時候我們可以更換 class 來實現(xiàn)更換圖標，但是這里僅僅支持 el 自帶的 icon 庫糟需。http://element-cn.eleme.io/#/zh-CN/component/icon 這個鏈接可以看到 el 自帶的所有圖標庫屉佳，還是蠻強大的，如果能在里面找到合適的圖標洲押，那你非常幸運武花，直接寫上相應(yīng)的類名就可以啦。
接下來我會圖文并茂的表達如何生成杈帐、引入体箕、使用自定義的圖標庫。
第一步：找 UI 拿到 svg 圖標挑童。如下圖一樣的文件累铅。
第二步：上阿里媽媽網(wǎng)站?http://www.iconfont.cn ，注冊并創(chuàng)建自己的項目站叼。
第三步：上傳 svg 圖標到我的項目中娃兽。下載項目文件：
第四部：引入自定義的資源换薄，我的項目是在 index.ejs 中引入的。
5.在 iconfont 文件中查看可以使用的樣式名：
6.在Element UI 里面使用對應(yīng)的 class：
7.效果展示
哈哈哈哈翔试，這個流程里面轻要，雖然還有些地方我也不是很理解，但是終于把目的達到了垦缅。歡迎有疑惑的小伙伴冲泥，或者更有經(jīng)驗的小伙伴留言交流。
碼字不易壁涎，如果對你有幫助凡恍，記得幫忙點個贊喲。謝謝??
