作为回应，为什么我必须在此收音机上单击两次？

Question

此单选按钮不显示为选中状态。当我单击它时，它被选中。如果删除name属性，它将正常工作。

这在功能性无状态（哑）组件中。

const dumbComp = ()=>(<input type="radio" name="asdf" checked="true" /> <h1>YO!</h1>)

我无法终生弄清楚“名字”的存在或缺失如何影响这里的行为。

其他一些人已经在我们的代码库中复制了此内容。

帮我，我的思想在这里融化...

编辑

但是我不能在jsbin / pen / etc中复制它。这使我怀疑该问题在堆栈中的某个位置更高。

这使问题更是...之一

是否有一个堆栈可以复制此组件中的错误？

Answer 1

非常简单，只需让状态设置输入的检查值即可。

示例：

<input type="radio" onChange={() => onCheck()} name="asdf" checked={this.state.checked} /> <h1>YO!</h1>

何时：

onCheck() => {
  //This reverts the value of checked key
  this.setState({checked: !this.state.checked});
}