fix(radio): update input uncontrolled value (#5186)

Co-authored-by: 07akioni <[email protected]>

CHANGELOG.zh-CN.md

@@ -18,6 +18,7 @@
 - 修复 `n-data-table` 总结栏有未设定的列时，会抛出 error
 - 修复 `n-drawer` 的 `on-mask-click` 属性可能被触发多次
 - 修复 `n-tree` 属性 `data` 当数据源`data`按一定场景多次发生切换时，动画处理的一些逻辑会导致渲染展示的数据出错，关闭 [#5217](https://github.com/tusen-ai/naive-ui/issues/5217)
+- 修复 `n-radio` value 值取消更新后，input 原生 checked 值未更新，关闭 [#5184](https://github.com/tusen-ai/naive-ui/issues/5184)
 
 ### Features
 

src/radio/src/use-radio.ts

@@ -6,7 +6,8 @@ import {
   type PropType,
   type Ref,
   type ComputedRef,
-  watchEffect
+  watchEffect,
+  nextTick
 } from 'vue'
 import { useMemo, useMergedState } from 'vooks'
 import { useConfig, useFormItem } from '../../_mixins'
@@ -107,7 +108,7 @@ function setup (props: ExtractPropTypes<typeof radioBaseProps>): UseRadio {
     }
   })
   const { mergedSizeRef, mergedDisabledRef } = formItem
-  const inputRef = ref<HTMLElement | null>(null)
+  const inputRef = ref<HTMLInputElement | null>(null)
   const labelRef = ref<HTMLElement | null>(null)
   const NRadioGroup = inject(radioGroupInjectionKey, null)
   const uncontrolledCheckedRef = ref(props.defaultChecked)
@@ -149,6 +150,12 @@ function setup (props: ExtractPropTypes<typeof radioBaseProps>): UseRadio {
   }
   function handleRadioInputChange (): void {
     toggle()
+    // eslint-disable-next-line @typescript-eslint/no-floating-promises
+    nextTick(() => {
+      if (inputRef.value) {
+        inputRef.value.checked = mergedCheckedRef.value
+      }
+    })
   }
   function handleRadioInputBlur (): void {
     focusRef.value = false