Question

嘿，我在更改textarea的内容方面遇到了问题。

这是我的textarea

<textarea
  className="fixedTextArea"
  defaultValue={this.props.predefValueSets[this.props.selection].values}
  onChange={(event) => this.changeHandle(event)}
/>

现在，当this.props.selection更改时，我想让textarea的内容也发生变化。我无法使用value代替defaultValue，因为我的textarea必须是可编辑的。

当我查看浏览器并检查我的textarea时，我看到内容如何变化，但它们没有被反映出来。

知道怎么处理这个吗？

Answer 1

最适合我的解决方案是使用<div>代替<textarea>。

我正在使用：

<div
  className="fixedTextArea"
  contentEditable
  suppressContentEditableWarning>
  {this.props.predefValueSets[this.props.selection].values}
</div>

这是一种管理onChange(...)的简单方法（因为<div>不会触发onChange-Events），但这在我的具体情况下并不重要。

Answer 2

使用ref

<textarea
  className="fixedTextArea"
  ref="fixedTextArea"
  defaultValue={this.props.predefValueSets[this.props.selection].values}
  onChange={(event) => this.changeHandle(event)}
/>

每次更改值时，请更新文本区域。

changeHandle(value){
  this.refs.fixedTextArea.value = value
}

Textarea的defaultValue未更新

2 个答案: