reactjs - React - _this2.SetState 不是一个函数

Question

我正在尝试创建一个将输入文本打印到屏幕上的组件，这就是我正在做的事情。

class SearchBar extends Component {
  constructor(props) {
    super(props);

    this.state = { term: '' };
  }

  render() {
    return (
      <div className="search-bar">
        <input value={this.state.term} onChange={event => this.SetState(event.target.value)} />
        The value of input is: {this.state.term}
      </div>
    );
  }
}

但是我在 Chrome 控制台中不断收到错误:

bundle.js:19818 Uncaught TypeError: _this2.SetState is not a function

有什么想法吗？

谢谢

Answer 1

试试这个:

class SearchBar extends Component {
  constructor(props) {
    super(props);
    this.state = { term: '' };
    this.setInputState = this.setInputState.bind(this);
  }
  
  setInputState(event) {
    this.setState({ term: event.target.value });
  }

  render() {
    return (
      <div className="search-bar">
        <input value={this.state.term} onChange={this.setInputState} />
        The value of input is: {this.state.term}
      </div>
    );
  }
}