react父组件调用子组件的方法
时间: 2023-10-07 22:04:19 浏览: 77
在React中,父组件可以通过ref属性获取子组件的实例,并调用其方法。具体步骤如下:
1. 在子组件中定义一个方法:
```
class Child extends React.Component {
childMethod() {
// 子组件方法的实现
}
render() {
// 子组件的渲染逻辑
}
}
```
2. 在父组件中创建一个ref引用:
```
class Parent extends React.Component {
constructor(props) {
super(props);
this.childRef = React.createRef();
}
render() {
return (
<div>
<Child ref={this.childRef} />
</div>
);
}
}
```
3. 在父组件中调用子组件的方法:
```
this.childRef.current.childMethod();
```
注意,子组件必须使用class定义,并且ref属性只能在class组件中使用。另外,ref引用的实际值需要在组件挂载后才能获取到,因此需要在constructor中使用React.createRef()创建一个“空”引用。
阅读全文