使用Vue技術棧開發不僅效率高,而且很友好,而且還有很多基於vue的UI框架,例如:element等,但是這類框架美中不足的是,圖標太少。為了解決這個問題,不得不引入第三方字體庫,今天以阿里圖標庫為例,如何在vue中使用。
1、首先找到合適圖標,然后點擊添加入庫,接着點擊右上角的購物車圖標。
2、你剛才選擇的圖標就能在側邊欄看到了,選擇要加入的項目(提前建好的項目),點擊確定。
3、進入我的項目頁面,就能看到所有選擇好的圖標,點擊下載至本地按鈕。
4、文件解壓后,將所有文件復制到如下目錄。
5、在main.js文件里引入iconfont.css。
6、現在就可以在項目中引入圖標了。必須添加iconfont類,然后再添加圖標名字作為類名。
<i class="iconfont icontuding"></i>