Vue Element-UI使用第三方icon圖標(轉)


轉載自:https://www.jianshu.com/p/59dd28f0b9c9

1.打開阿里icon,注冊 >登錄>圖標管理>我的項目

 

2.新建項目

3. 添加icon到項目中

在圖標庫中找到想要的icon后,加入購物車,然后點擊右上角的購物車,把icon添加到你的項目里吧~

設置fontClass,然后下載到本地

5.下載后進行解壓。解壓后修改其中iconfont.css文件

 注意:el-icon-ali是你之前設置的icon前綴,第二個el-icon-ali前邊有空格的

 

6.上邊設置好以后,打開vue項目,在src-assets下創建了icon文件夾,將所有的文件復制了過來

在main.js里邊把css引進來

然后重新npm run dev 一下

7.打開在阿里icon的項目,復制你想要的圖標代碼

使用兩種引用方式,跟element自帶的使用方法一樣

<el-button icon="el-icon-alifresh"  size="small" circle @click="updateNum"></el-button>
<i class="el-icon-alifresh"></i>

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM