在vue專案中使用iconfont

2022-06-25 18:06:13 字數 634 閱讀 7458

在實際的專案開發中,我們經常會借助confont圖示庫來渲染一些圖示

本文將以win平台為例,詳細介紹在vue專案中使用iconfont的一般流程

開啟 iconfont官網

二、在專案中引入、使用 iconfont

在vue專案的styles目錄下,新建 iconfont 目錄

將 以 iconfont為檔名、以.eot .svg .ttf .woff為字尾的4個檔案放入iconfont目錄中

將 iconfont.css 檔案放入styles目錄下

在main.js中引入css檔案

import 'styles/iconfont.css'
然後開啟 iconfont.css 檔案,修改相關檔案的src路徑

最後,在需要用到圖示的html**中

為圖示所在的標籤新增 class="iconfont"

並回到iconfont官網,複製圖示**到標籤內即可

在 Vue 專案中使用 ECharts

重要檔案版本 在 vue 專案中使用 echarts 只需要在 vue 元件的mounted生命週期中 初始化 echarts,然後在每次配置項有變更時呼叫setoption 方法更新配置即可 專案模板原始碼 class default chart style div template import...

在vue專案中使用echarts

安裝echarts依賴 npm install echarts s 建立圖表 全域性引入 main.js 引入echarts import echarts from echarts vue.prototype.echarts echarts 這裡也可以在router下index.js引入,看規定 h...

在vue專案中使用ueditor

從ueditor的官網ueditor編輯器,官網位址為 將上述ueditor資料夾拷貝到vue專案的static資料夾中,此資料夾為專案的靜態服務資料夾 2.修改配置 在ueditor.config.js中修改如下 window.ueditor home url static ueditor var...