效果图:
main.js中引入:
import iconPicker from 'e-icon-picker';
import "e-icon-picker/lib/symbol.js"; //基本彩色图标库
import 'e-icon-picker/lib/index.css'; // 基本样式,包含基本图标
import 'font-awesome/css/font-awesome.min.css'; //font-awesome 图标库
import 'element-ui/lib/theme-chalk/icon.css'; //element-ui 图标库
Vue.use(iconPicker, { eIcon: true, ElementUI: true, FontAwesome: true, eIconSymbol: true });
使用:
<!--main-->
<template>
<div>
当前图标:{{icon}}
<e-icon-picker v-model="icon" style="width:500px" />
</div>
</template>
<script>
export default {
data() {
return {
icon: ""
};
}
};
</script>