Element-UI配个第三方字体图片插件使用

Element-UI配个第三方字体图片插件使用

• 我这里采用的是阿里icon

1. 选择好你的图标之后download完成之后将里面需要的文件放在一个自定义的文件夹内
   
2. 按照下载的演示文档给的要求，按照他的要求引入，比如我这里采用的是font-css引入

import Vue from 'vue'
import App from './App.vue'
import router from './router'
import './plugins/element.js' // 封装的局部引入的element-ui插件
import '@/assets/font/iconfont.css'; // 全局引入font-icon

3. 在Element-UI的html代码中引用他给他的必须类型，比如说我这里是必须的class=".iconfont .icon-xxx"
   如果用的是class就记得加上.，像在element-ui中的自定义属性中就不用加.了

      <el-form-item>
        <el-input prefix-icon="iconfont icon-suo"></el-input>
      </el-form-item>

• 最终生成字体图标