Question

defaultValue仅在首次加载页面时有效。当再次加载同一页面但具有不同的props时，不受控制的输入字段不会使用新props中的新值填充。似乎没有办法为react中的非受控输入字段设置值？

我使用Material-UI，我的不受控制的输入字段看起来像这样：

<TextField
  ref={input => this.dataNode.Name = input}
  defaultValue={this.props.dataNode.Name}
  floatingLabelText="Name"
/>

似乎在输入中添加一个随机key就可以了，但是，我真的需要为每个不受控制的输入引入随机密钥吗？

<TextField
  key={some_random_thing}
  ref={input => this.dataNode.Name = input}
  defaultValue={this.props.dataNode.Name}
  floatingLabelText="Name"
/>

Answer 1

通过添加key={Math.random()}来解决（解决）问题：

<TextField
  key={Math.random()}
  ref={input => this.dataNode.Name = input}
  defaultValue={this.props.dataNode.Name}
  floatingLabelText="Name"
/>

难看！

Answer 2

由于您正在“设置输入”，您正试图“控制”输入字段。我会继续进行额外的几行代码，使其成为受控输入。这没有什么害处，实际上我认为你试图以“反应”的思维方式去做。

填充不受控制的反应输入字段的正确方法是什么？

2 个答案: