Javascript 如何在状态更改时停止reactjs组件重新加载

我有一个带有一些输入字段的表单（其中一些字段在选中复选框之前是隐藏的。当我选中/取消选中复选框时，会设置一个特定的状态（

this.state.isChecked=true/false

）

在render方法中，我有一个div（包含一些输入字段），其中包含一些类和“show”类的条件：

…

预期的行为是，在状态更改时，仅将“show”类从div中放入或删除 当前行为：再次呈现整个表单，输入字段中写入的所有数据都将丢失

---

如何做到这一点？

如果输入字段的值很重要（它们显然很重要），如果它们可以改变（它们显然可以改变），那么React应该知道它们，通常是在状态下。
维护输入字段内容的“标准”（仅限打开）反应方式为：

• 将输入字段的内容也置于状态
• 将类似于

  value={this.state.foo}

  和

  onChange={this.\u onChange（）}

  的内容包含到每个输入字段的呈现中
• 在表单中包含

  \u onChange（）

  函数以处理输入更改

这样，每当重新呈现表单时（在每次

setState（）

之后），输入值也会保留

---

PS：问题标题“状态更改时从重新加载程序停止reactjs组件”没有真正涵盖文本中的问题：您要求部分重新呈现：根据复选框重新呈现“显示/隐藏额外字段”，但不要重新呈现输入字段。

简短的回答是，您可以使用shouldUpdateComponent生命周期事件阻止组件呈现/更新：

但是，我同意前面的回答，即为了执行听起来像是部分重新渲染的操作，并遵循一般最佳实践，您应该将输入字段的状态存储在组件中的某个位置，以便它们在渲染调用之后保持不变