ElementUI：项目中引入自己的ICON，面试时答不上来怎么办

在ElementUI中引入自己的图标，可以通过以下步骤进行：

1. 准备图标文件：将自己的图标文件保存为SVG格式。
2. 创建一个新的Vue组件：

<template>
  <svg :class="svgClass" aria-hidden="true">
    <use :xlink:href="iconName"></use>
  </svg>
</template>
 
<script>
export default {
  name: 'MyIcon',
  props: {
    iconClass: {
      type: String,
      required: true
    },
    className: {
      type: String,
      default: ''
    }
  },
  computed: {
    iconName() {
      return `#icon-${this.iconClass}`;
    },
    svgClass() {
      if (this.className) {
        return 'svg-icon ' + this.className;
      } else {
        return 'svg-icon';
      }
    }
  }
}
</script>
 
<style scoped>
.svg-icon {
  width: 1em;
  height: 1em;
  fill: currentColor;
  overflow: hidden;
}
</style>

3. 在main.js中全局注册组件：

import Vue from 'vue'
import MyIcon from './components/MyIcon.vue'
 
Vue.component('my-icon', MyIcon)

4. 在index.html中引入SVG symbols：

<svg style="display:none;">
  <symbol id="icon-user" viewBox="0 0 1024 1024">
    <!-- 这里是用户图标的SVG路径 -->
  </symbol>
  <!-- 其他图标 -->
</svg>

5. 在其他组件中使用自定义图标：

<template>
  <my-icon icon-class="user" class="my-icon-style"></my-icon>
</template>
 
<style>
.my-icon-style {
  color: red;
  /* 其他样式 */
}
</style>

确保图标文件和组件的命名与使用保持一致。如果面试官询问具体的代码实现，以上步骤和示例代码应该能够满足需求。如果遇到具体的面试问题，可以针对性地提供解决方案。