feat: the Button component extends the and attributes

src/components/Button/index.vue

@@ -1,7 +1,12 @@
 <template>
   <Button v-bind="getBindValue" :class="[getColor, $attrs.class]">
-    <template #[item]="data" v-for="item in Object.keys($slots)">
+    <!-- <template #[item]="data" v-for="item in Object.keys($slots)">
       <slot :name="item" v-bind="data" />
+    </template> -->
+    <template #default="data">
+      <g-icon :icon="preIcon" class="mr-1" v-if="preIcon" />
+      <slot v-bind="data" />
+      <g-icon :icon="preIcon" class="ml-1" v-if="postIcon" />
     </template>
   </Button>
 </template>
@@ -44,6 +49,12 @@
         type: Boolean as PropType<boolean>,
         default: false,
       },
+      preIcon: {
+        type: String as PropType<string>,
+      },
+      postIcon: {
+        type: String as PropType<string>,
+      },
     },
     setup(props, { attrs }) {
       const getListeners = computed(() => {

src/views/demo/feat/msg/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="p-4">
     <CollapseContainer class="px-20 bg-white w-full h-32 rounded-md" title="Message">
-      <a-button @click="infoMsg('Info message')" class="mr-2">Info</a-button>
+      <a-button @click="infoMsg('Info message')" class="mr-2"> Info </a-button>
       <a-button @click="successMsg('Success message')" class="mr-2" color="success">
         Success
       </a-button>