refactor ts

src/components/SvgIcon/index.vue

@@ -1,39 +1,33 @@
-<template>
-  <svg :class="svgClass" aria-hidden="true">
-    <use :xlink:href="iconName" :fill="color" />
-  </svg>
-</template>
-
-<script>
-export default defineComponent({
-  props: {
-    iconClass: {
-      type: String,
-      required: true
-    },
-    className: {
-      type: String,
-      default: ''
-    },
-    color: {
-      type: String,
-      default: ''
-    },
+<script setup lang="ts">
+const props = defineProps({
+  iconClass: {
+    type: String,
+    required: true
   },
-  setup(props) {
-    return {
-      iconName: computed(() => `#icon-${props.iconClass}`),
-      svgClass: computed(() => {
-        if (props.className) {
-          return `svg-icon ${props.className}`
-        }
-        return 'svg-icon'
-      })
-    }
+  className: {
+    type: String,
+    default: ''
+  },
+  color: {
+    type: String,
+    default: ''
+  },
+})
+const iconName =  computed(() => `#icon-${props.iconClass}`);
+const svgClass = computed(() => {
+  if (props.className) {
+    return `svg-icon ${props.className}`
   }
+  return 'svg-icon'
 })
 </script>
 
+<template>
+	<svg :class="svgClass" aria-hidden="true">
+		<use :xlink:href="iconName" :fill="color" />
+	</svg>
+</template>
+
 <style scope lang="scss">
 .sub-el-icon,
 .nav-icon {

src/components/SvgIcon/svgicon.js

@@ -1,10 +0,0 @@
-import * as components from '@element-plus/icons-vue'
-
-export default {
-    install: (app) => {
-        for (const key in components) {
-            const componentConfig = components[key];
-            app.component(componentConfig.name, componentConfig);
-        }
-    },
-};