为什么 `this.setState` 未定义或者不是我的 React 事件处理程序中的函数？

在事件处理程序中访问 React 实例（this）

问题：

尝试时在事件处理程序中使用 this.setState 更新 React 状态，您可能会遇到以下错误“无法读取未定义的属性‘setState’” 或 “this.setState 不是函数”。这表明 this 关键字没有引用事件处理程序中的组件实例。

说明：

在 ES6 React 组件中，绑定到组件的函数应该定义在构造函数或使用 this.methodName.bind(this) 在渲染方法中显式绑定。这是因为 JavaScript 箭头函数语法（例如 () =>）创建了一个新的函数作用域，并且不会自动将其绑定到组件。

解决方案：

方法一（绑定构造函数）：

constructor(props) {
  super(props);
  this.state = { inputContent: 'startValue' };
  this.changeContent = this.changeContent.bind(this); // Binding here
}

方法 2（渲染中绑定）：

render() {
  return (
    <input onChange={this.changeContent.bind(this)} />
  );
}

注意： 使用 React 时。 createClass，所有方法自动绑定到组件上

其他更正：

在代码中，React.refs.someref 应替换为 this.refs.someref 以访问 React 元素引用。此外，sendContent 方法需要使用上述任何一种绑定方法绑定到组件。

以上是为什么 `this.setState` 未定义或者不是我的 React 事件处理程序中的函数？的详细内容。更多信息请关注PHP中文网其他相关文章！