Revert "fix(components): [radio] Divide attrs into label and input (#…

…8476)"

This reverts commit 2d8a9e4.

packages/components/radio/__tests__/radio.test.tsx

@@ -373,54 +373,4 @@ describe('Radio Button', () => {
       expect(radioGroup2.attributes()['aria-labelledby']).toBeFalsy()
     })
   })
-
-  describe('laebl for', () => {
-    test('label and radio', async () => {
-      const radio = ref('')
-      const forId = ref('radio1121')
-      const wrapper = mount(() => (
-        <>
-          <label for={forId.value}>click here</label>
-          <Radio v-model={radio.value} label="Foo" id="radio1121" />
-        </>
-      ))
-      await nextTick()
-      const label = wrapper.find('label')
-      label.trigger('click')
-      expect(radio.value).toBe('Foo')
-      // no for
-      radio.value = ''
-      forId.value = undefined
-      await nextTick()
-      label.trigger('click')
-      expect(radio.value).toBe('')
-    })
-
-    test('label and radioGroup', async () => {
-      const compList = [Radio]
-      compList.forEach(async (comp) => {
-        const radio = ref('')
-        const forId = ref('radio1121')
-        const wrapper = mount(() => (
-          <>
-            <label for={forId.value}>click here</label>
-            <RadioGroup v-model={radio.value}>
-              <comp label="Foo" id="radio1121" />
-              <comp label="Bar" id="radio1122" />
-            </RadioGroup>
-          </>
-        ))
-        await nextTick()
-        const label = wrapper.find('label')
-        label.trigger('click')
-        expect(radio.value).toBe('Foo')
-        // no for
-        radio.value = ''
-        forId.value = undefined
-        await nextTick()
-        label.trigger('click')
-        expect(radio.value).toBe('')
-      })
-    })
-  })
 })

packages/components/radio/src/radio.vue

@@ -7,10 +7,7 @@
       ns.is('bordered', border),
       ns.is('checked', modelValue === label),
       ns.m(size),
-      rawAttrs.class,
     ]"
-    :style="containerStyle"
-    v-bind="labelListieners"
   >
     <span
       :class="[
@@ -27,7 +24,6 @@
         :name="name || radioGroup?.name"
         :disabled="disabled"
         type="radio"
-        v-bind="inputAttrs"
         @focus="focus = true"
         @blur="focus = false"
         @change="handleChange"
@@ -43,29 +39,17 @@
 </template>
 
 <script lang="ts" setup>
-import { computed, nextTick, useAttrs as useRawAttrs } from 'vue'
-import { useAttrs, useNamespace } from '@element-plus/hooks'
+import { nextTick } from 'vue'
+import { useNamespace } from '@element-plus/hooks'
 import { radioEmits, radioProps } from './radio'
 import { useRadio } from './use-radio'
-import type { StyleValue } from 'vue'
 
 defineOptions({
   name: 'ElRadio',
-  inheritAttrs: false,
 })
 
 const props = defineProps(radioProps)
 const emit = defineEmits(radioEmits)
-const rawAttrs = useRawAttrs()
-const containerStyle = computed<StyleValue>(() => rawAttrs.style as StyleValue)
-
-const inputAttrs = useAttrs({ excludeListeners: true })
-
-const labelListieners = useAttrs({
-  excludeKeys: computed<string[]>(() => {
-    return Object.keys(inputAttrs.value)
-  }),
-})
 
 const ns = useNamespace('radio')
 const { radioRef, radioGroup, focus, size, disabled, modelValue } = useRadio(