在我的 React 组件中，我有一个带有 onSubmit 函数的表单
<form className="form-horizontal" name="taskForm" onSubmit={this.submitTask}>
submitTask(e) {
e.preventDefault();
console.log(this.props); // undefined
console.log(this) // window object
}
出于某种原因this.props，当我使用表单 onSubmit 时不在范围内。当我console.log(this.props)在构造函数中时，props正常注销。
当我console.log(this)是窗口对象时。我如何获得react组件的范围？
这是一个更广泛的问题，因为当您使用其他组件事件（例如（onClick、onChange、onSubmit）时，您会注意到与此类似的行为）
在文档中有关于它的注释：
https://facebook.github.io/react/docs/reusable-components.html#no-autobinding
方法遵循与常规 ES6 类相同的语义，这意味着它们不会自动将 this 绑定到实例。您必须明确使用 .bind(this) 或箭头函数 =>。
正如所描述的，您必须绑定这些方法或使用箭头函数。如果选择绑定，则可以在构造函数中绑定，也可以在渲染组件中严格绑定。
在构造函数中：
constructor(props) {
super(props);
this.submitTask = this.submitTask.bind(this);
}
在渲染组件中：
<form className="form-horizontal" name="taskForm" onSubmit={this.submitTask.bind(this)}>
使用箭头函数，您可以将 submitTask 内容传递给箭头函数：
<form className="form-horizontal" name="taskForm" onSubmit={e => {
e.preventDefault();
console.log(this.props); // undefined
console.log(this) // window object
}}>