子组件 调用父组件方法
时间: 2023-10-06 18:14:12 浏览: 117
在React中,子组件可以通过props传递一个函数给父组件,然后父组件可以调用该函数。
下面是一个示例:
```jsx
// 父组件
class ParentComponent extends React.Component {
handleChildClick = () => {
console.log("子组件点击了");
};
render() {
return <ChildComponent handleClick={this.handleChildClick} />;
}
}
// 子组件
class ChildComponent extends React.Component {
render() {
return <button onClick={this.props.handleClick}>点击我</button>;
}
}
```
在上面的示例中,父组件`ParentComponent`定义了一个`handleChildClick`方法,然后把该方法作为props传递给子组件`ChildComponent`。子组件在渲染时,将按钮的点击事件绑定到`this.props.handleClick`,当按钮被点击时,触发父组件传递的方法。
这样,子组件就可以通过调用父组件传递的方法来实现与父组件的交互。
阅读全文