Question

这是我拥有的组件层次结构。

<Parent>
    <Child1>
        <Child2>
        </Child2>
    </Child1>
<Parent>

在 Child2 组件中，有一个名为 handlePatch（）的函数。我需要从 Parent 组件中调用它，但不知道如何操作。对此最好的方法是什么？

感谢。

Answer 1

您可以将ref组件的Child作为道具传递给Parent并访问该组件以调用该功能

class App extends React.Component {
    constructor() {
       super();
       this.child = null;
    }
    render() {
        return (
             <Parent childRef={this.child}>
                <Child ref={(ref) => this.child = ref}/>
             <Parent>
        )
    }
}

class Parent extends React.Component {
    myfunc = () => {
        //call child function
        this.props.childRef.handlePatch();
    }
}

但是，您可以尝试通过更好地重构代码并直接从Child组件的容器中调用Parent中的函数来避免它。

如何在React中访问this.props.children函数

1 个答案: