优化自定义图标功能，修复上线后无法展示自定义图标的问题。 (#1625)

* 修改自定义图标使用方式

* 优化自定义icon功能

web/src/core/global.js

@@ -3,26 +3,14 @@ import { h } from 'vue'
 
 // 统一导入el-icon图标
 import * as ElIconModules from '@element-plus/icons-vue'
+import svgIcon from '@/components/svgIcon/svgIcon.vue'
 // 导入转换图标名称的函数
 
-const createIconComponent = (svgContent) => ({
+const createIconComponent = (name) => ({
   name: 'SvgIcon',
-  props: {
-    iconClass: {
-      type: String,
-      default: '',
-    },
-    className: {
-      type: String,
-      default: '',
-    },
-  },
   render() {
-    const { className } = this
-    return h('span', {
-      class: className,
-      ariaHidden: true,
-      innerHTML: svgContent,
+    return h(svgIcon, {
+      name: name,
     })
   },
 })
@@ -30,15 +18,14 @@ const createIconComponent = (svgContent) => ({
 const registerIcons = async(app) => {
   const iconModules = import.meta.glob('@/assets/icons/**/*.svg')
   for (const path in iconModules) {
-    const response = await fetch(path)
-    const svgContent = await response.text()
     const iconName = path.split('/').pop().replace(/\.svg$/, '')
     // 如果iconName带空格则不加入到图标库中并且提示名称不合法
+    console.log(iconName)
     if (iconName.indexOf(' ') !== -1) {
       console.error(`icon ${iconName}.svg includes whitespace`)
       continue
     }
-    const iconComponent = createIconComponent(svgContent)
+    const iconComponent = createIconComponent(iconName)
     config.logs.push({
       'key': iconName,
       'label': iconName,
@@ -52,6 +39,7 @@ export const register = (app) => {
   for (const iconName in ElIconModules) {
     app.component(iconName, ElIconModules[iconName])
   }
+  app.component('SvgIcon', svgIcon)
   registerIcons(app)
   app.config.globalProperties.$GIN_VUE_ADMIN = config
 }