From 4fee587fd96a6da12249134b948356b39cd74fcf Mon Sep 17 00:00:00 2001
From: cKey <35512826+colinin@users.noreply.github.com>
Date: Wed, 1 Feb 2023 15:06:05 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8DRadioButtonGroup?=
 =?UTF-8?q?=E7=BB=84=E4=BB=B6=E8=BF=94=E5=9B=9E=E5=80=BC=E4=B8=8D=E6=AD=A3?=
 =?UTF-8?q?=E7=A1=AE=E7=9A=84bug?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Form/src/components/RadioButtonGroup.vue        | 13 +++++++++----
 1 file changed, 9 insertions(+), 4 deletions(-)

diff --git a/apps/vue/src/components/Form/src/components/RadioButtonGroup.vue b/apps/vue/src/components/Form/src/components/RadioButtonGroup.vue
index c2c7b220b..3d3cd1dd7 100644
--- a/apps/vue/src/components/Form/src/components/RadioButtonGroup.vue
+++ b/apps/vue/src/components/Form/src/components/RadioButtonGroup.vue
@@ -4,14 +4,14 @@
 <template>
   <RadioGroup v-bind="attrs" v-model:value="state" button-style="solid">
     <template v-for="item in getOptions" :key="`${item.value}`">
-      <RadioButton :value="item.value" :disabled="item.disabled">
+      <RadioButton :value="item.value" :disabled="item.disabled" @click="handleClick(item)">
         {{ item.label }}
       </RadioButton>
     </template>
   </RadioGroup>
 </template>
 <script lang="ts">
-  import { defineComponent, PropType, computed } from 'vue';
+  import { defineComponent, PropType, computed, ref } from 'vue';
   import { Radio } from 'ant-design-vue';
   import { isString } from '/@/utils/is';
   import { useRuleFormItem } from '/@/hooks/component/useFormItem';
@@ -22,6 +22,7 @@
 
   export default defineComponent({
     name: 'RadioButtonGroup',
+    emits: ['change'],
     components: {
       RadioGroup: Radio.Group,
       RadioButton: Radio.Button,
@@ -37,8 +38,9 @@
     },
     setup(props) {
       const attrs = useAttrs();
+      const emitData = ref<any[]>([]);
       // Embedded in the form, just use the hook binding to perform form verification
-      const [state] = useRuleFormItem(props);
+      const [state] = useRuleFormItem(props, 'value', 'change', emitData);
 
       // Processing options value
       const getOptions = computed((): OptionsItem[] => {
@@ -51,7 +53,10 @@
         return options.map((item) => ({ label: item, value: item })) as OptionsItem[];
       });
 
-      return { state, getOptions, attrs };
+      function handleClick(...args) {
+        emitData.value = args;
+      }
+      return { state, getOptions, attrs, handleClick };
     },
   });
 </script>