ElementUI自定義icon步驟條

在使用ElementsUI中的步驟條時，有時會遇到自定義icon的情況。但element icon數量不多，可能找不到需要的。

這時我們可以自定義icon，同樣通過類來引用。首先我們先下載好需要的icon，具體過程可以搜索iconfont下載。

下載好之后解壓，將這五個文件加入到我們的項目中。在iconfont.css頁面可以修改圖片類的名稱，方便引用。

在main.js頁面引用iconfont

import './assets/icon/iconfont.css'

這時我們就可以正常使用icon了，在icon處填寫剛才定義好的類。

變色部分的處理：一般情況下未完成的步驟是灰色，我們可以直接操作element的類

.el-step__head.is-process {
    color: #9ea4af;
};
.step1 .el-step__head.is-finish {
    color: #FF0000;
    border-color: #FF0000;
}

這樣就完成了變色的效果。