Javascript React无线电输入仅在单击标签时更改

我为无线电输入创建了一个受控组件。
除非我点击标签，否则单选按钮不会被选中

实际的后端状态值发生变化，并且我用于“checked”属性的逻辑正在触发，它只是不想正确渲染

（在本例中，我使用为自己的目的创建的自定义字段对象。）

功能放射性输入（道具）{
返回(
{console.log（'fire onChange'）；props.field.onChange（props.choice）}
onFocus={（evt）=>props.field.onFocus（evt）}
onBlur={（evt）=>props.field.onBlur（evt）}
style={errStyle}
id={props.field.name+'-'+props.choice}
值={props.choice}
选中={（console.log（'fire checked'，props.field.name，props.choice，props.field.value，props.choice==props.field.value））| |（props.choice==props.field.value）}
/>
)
}

因此，当我点击实际单选按钮时，我可以看到日志输出从checked启动，并且所有的值都是正确的。它只是不想正确渲染

当我单击此输入的标签时，会生成相同的控制台输出，但这会正确呈现radio checked状态

我做错了什么

更新： 标签没有功能。仅使用htmlFor的直接标签

<label htmlFor={"radio button name"}>LABEL TEXT</>

标签文本

更新2: 下面是一个代码笔，演示了这一点。

我会重新检查我的代码来解决这个问题

更新3:

---

我放弃了，只是做了一个自定义css单选按钮。这远远不够理想，因为我无法像人们通常所期望的那样通过一个表单进行制表。非常令人沮丧

这没有理由不起作用。问题可能出在

onChange

函数上，该函数不会改变，也可能出在传递给

输入组件的值上

我为您创建了一个工作示例：

也许通过匹配我所做的操作，您可以成功更新组件。
checked属性的值应设置为true。你能试着设置，checked={props.field.val===true}类似这样的设置，然后将props.field.value设置为true吗？你能显示你用于标签的函数吗？@nitesh:checked属性将为true或false。此处的值必须正确，否则单击标签也不起作用。@deividas:标签没有函数，只使用默认的label元素和htmlFor属性。感谢您将笔放在一起。我稍微修改了一下，使它更像我正在做的事情。正如你所提到的，这没有理由不起作用，所以这一定是我这边的地方@那么你还需要帮助吗，还是已经解决了？如果你仍然需要帮助，如果你能在你的作品中添加一支修改过的钢笔，那就太好了，这样我就可以看一看了。我将重新回顾一下我的作品。我刚才在粘贴修改过的笔之前按了回车键。我编辑了评论。我也会把它放在OP里
<label htmlFor={"radio button name"}>LABEL TEXT</>