在React 15.x中，子组件通过props调用父组件包含setState的方法时出现错误，最常见的原因是父组件方法的this指向丢失，导致调用setState时出现Cannot read property 'setState' of undefined之类的错误。

核心原因

React类组件的方法默认不会绑定this，当父组件将方法通过props传递给子组件时，如果没有正确绑定this，子组件调用时this会指向undefined（而非父组件实例），而setState需要通过组件实例调用，因此会报错。

解决方案

需要在父组件中确保方法的this正确指向组件实例，常用方式有3种：

1. 构造函数中绑定this（推荐）

在父组件的constructor中使用bind绑定this，这是React官方推荐的方式，性能更优。

// 父组件
class ParentComponent extends React.Component {constructor(props) {super(props);this.state = {count: 0};// 关键：绑定this到当前组件实例this.handleIncrement = this.handleIncrement.bind(this);}// 包含setState的方法handleIncrement() {this.setState({ count: this.state.count + 1 });}render() {return (<div>{/* 传递绑定后的方法给子组件 */}<ChildComponent onIncrement={this.handleIncrement} /></div>);}
}// 子组件
class ChildComponent extends React.Component {render() {return (<button onClick={this.props.onIncrement}>点击增加</button>);}
}

2. 使用箭头函数定义方法（ES6+）

箭头函数会自动继承上下文的this，因此定义方法时直接用箭头函数，可避免手动绑定。

// 父组件
class ParentComponent extends React.Component {state = {count: 0};// 箭头函数自动绑定thishandleIncrement = () => {this.setState({ count: this.state.count + 1 });};render() {return (<div><ChildComponent onIncrement={this.handleIncrement} /></div>);}
}// 子组件同上

3. 传递时使用箭头函数绑定（不推荐）

在传递给子组件时，通过箭头函数动态绑定this。但这种方式会导致每次render时创建新的函数实例，可能引发子组件不必要的重渲染，性能较差。

// 父组件
class ParentComponent extends React.Component {state = {count: 0};handleIncrement() {this.setState({ count: this.state.count + 1 });}render() {return (<div>{/* 传递时用箭头函数绑定this（不推荐） */}<ChildComponent onIncrement={() => this.handleIncrement()} /></div>);}
}// 子组件同上

总结

推荐使用构造函数绑定this或箭头函数定义方法，这两种方式能确保父组件方法中的this正确指向组件实例，从而正常调用setState。避免在传递时动态创建箭头函数，以免影响性能。

如果错误仍存在，可检查：

• 子组件调用方法时是否误加了括号（如onClick={this.props.onIncrement()}会导致立即执行）
• 父组件方法是否有异步操作导致this指向异常
• React版本是否确实为15.x（部分语法在不同版本可能有差异）