vue中封裝svg icon元件並使用

1.使用vue-cli3.0腳手架執行搭建乙個專案，位址

截圖如下：

2.components檔案下新建svgicon元件

檔案中的**如下：

icons檔案下的index.js檔案中的**如下：

import vue from 'vue'import svgicon from '@/components/svgicon'//

svg元件
//register globally
vue.component('svg-icon', svgicon)
const req = require.context('./svg', false, /\.svg$/)
const requireall = requirecontext =>requirecontext.keys().map(requirecontext)
requireall(req)

5.直接在元件中使用icon-class為svg名字的圖示即可

6.注意：安裝svg-sprite-loader，並且在vue.config.js檔案下配置

7.執行專案，顯示圖示

vue封裝svgIcon公共元件

1 在components新建common svgicon.vue 2 在src下新建assets image icons svg用於存放.svg檔案 3 在src下新建assets image icons index.js import vue from vue import svgicon fr...

Vue中封裝input元件

最近有點忙不過來 脫了很久，沒有更新 抱歉。今天要將的時如何自定義封裝input元件 博主知識發個簡單的模板 碼友們可以更具自己的實際專案新增需要的引數 我的專案中的ui圖是這樣的 如下 子元件的模板設定 completion input box input box name type text r...

vue中封裝全域性元件方法

vue專案中全域性註冊js檔案 首先是建立乙個js檔案叫toast.js export const toast var div document.getelementsbytagname div 0 toast2 這裡的方法就是快捷新增樣式的函式 function style domname,obj...