javascript - 在 onChange 中使用时 react setState 工作缓慢

Question

我有一个文本区域，我正在尝试获取值并设置为状态。但它的工作速度如此之慢，所以我正在输入一些东西，我在 10-15 秒后看到了值(value)。为什么会发生？

我的状态:

constructor(props) {
    super(props);
    this.state = {
      comment: ''
    };
    this.getValue = this.getValue.bind(this)
  }

我的 onChange 函数:

getValue = (e) => {
   this.setState({comment: e.target.value})
}

我的文本区域:

 <textarea
   type="text"
   value={this.state.comment}
   onChange={this.getValue}
 />

Answer 1

下面的代码片段似乎工作正常并且没有您所说的延迟，您的代码是否与此类似？你能分享更多细节吗？状态更新是否在应用程序的其余部分正常工作？

class Thingy extends React.Component {

  constructor(props) {
    super(props);
    this.state = {
      comment: ''
    };
  }
  
  getValue = (e) => {
   this.setState({comment: e.target.value})
  }
  
  render() {
    return (
    <React.Fragment>
      <p>{this.state.comment}</p>
      <textarea
       type="text"
       value={this.state.comment}
       onChange={this.getValue}
      />
    </React.Fragment>
    );
  }
}

// Render it
ReactDOM.render(
  <Thingy />,
  document.getElementById("react")
);

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>
<div id="react"></div>