我在 React 和复选框方面遇到了一个非常烦人的问题。我正在使用的应用程序需要一个复选框列表，这些复选框代表保留在后端的设置。有一个选项可以将设置恢复到原始状态。
起初，我创建了一个组件，它有一个像设置地图这样的对象。每个设置都有一个键和一个布尔值。因此：
{
bubbles: true,
gregory: false
}
表示为：
<input type="checkbox" value="bubbles" checked="checked" />
<input type="checkbox" value="gregory" />
现在，React 似乎对复选框应该如何工作一无所知。我不想设置复选框的值，我想要“checked”属性。
然而，如果我尝试这样的事情：
<input
type="checkbox"
value={setting}
checked={this.settings[setting]}
onChange={this.onChangeAction.bind(this)}
/>
我收到此警告：
警告：AwesomeComponent 正在更改要控制的复选框类型的不受控制的输入。输入元素不应从不受控制切换到受控制（反之亦然）。决定在组件的生命周期内使用受控或非受控输入元素。更多信息：[一些无用的文档页面我读了好几次都无济于事]
所以我决定创建另一个组件来包装每个单独的复选框，我得到了这个：
<input
type="checkbox"
checked={this.state.checked}
onChange={this.onChangeAction.bind(this)}
/>
现在checked是直接存在于我所在州的财产。
这会产生相同的警告，所以我尝试使用defaultChecked：
<input
type="checkbox"
defaultChecked={this.state.checked}
onChange={this.onChangeAction.bind(this)}
/>
这使警告消失，但现在无法将该checked值重置为默认值。所以我尝试使用方法componentWillReceiveProps，这样我很确定我的状态是正确的，this.state.checked是正确的，并且组件再次呈现。
确实如此。但复选框保持原样。现在我留下了那个丑陋的警告，我正在使用checked. 我该如何解决这个问题，使警告消失？
我在想，也许有一种方法可以强制重新渲染组件，以便它捕获新defaultChecked值并使用它。但我不知道该怎么做。也许只为这个组件抑制警告？那可能吗？也许还有其他事情可以做？