1、訪問Iconfont-阿里巴巴矢量圖標(biāo)庫，下載自己想要的圖片，下載svg格式備用

2、通過百度字體編輯器打開本地最新的uni.ttf文件(http://fontstore.baidu.com/static/editor/index.html#)，打開之后可以看到所有的uni所有圖標(biāo)都在里面

3、導(dǎo)入第一步下載好的圖標(biāo)，導(dǎo)入之后，可以看到在最后一頁的末尾已經(jīng)有我們新增的圖標(biāo)了

4、點(diǎn)擊設(shè)置代碼點(diǎn)，新增的圖標(biāo)會(huì)按順序自動(dòng)生成代碼

注意：先選中新增的圖標(biāo)再設(shè)置，否則所有的圖標(biāo)代碼都會(huì)改變（設(shè)置代碼點(diǎn)后可以點(diǎn)擊調(diào)整字形修改圖標(biāo)名稱）

5、導(dǎo)出為ttf

6、將uniicons.tff文件轉(zhuǎn)為base64字符串，一樣通過在線轉(zhuǎn)換工具(https://www.motobit.com/util/base64-decoder-encoder.asp)

7、轉(zhuǎn)換完之后，需要去除掉換行，使用

在線過濾文本行所有換行 去除掉所有換行

8、將整理好的一行字符串替換掉uni-icons.vue文件中原有的base64字符串

9、在icons.js中增加圖標(biāo)

10、使用

這時(shí)候就可以在引入組件之后，直接使用

<uni-icons type="company" size='20' class='input-uni-icon'></uni-icons>

總結(jié)

以上是生活随笔為你收集整理的uniapp图标_uniapp扩展自定义uniIcon组件图标的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。