javascript - 当子组件嵌套多个父组件时，从子组件调用 super 父函数

Question

让我们假设一个 React 组件有多个父组件。当我想调用 super 父级(最高级别组件)的函数时。我怎样才能做到这一点。请参阅示例代码。

```

export default class WeekView extends React.Component {      
    constructor(props) {
        super(props);
    }

    // this functions has to be called from third child
    loadData() {
        var data = [];
        this.setState({events : data});
    }

    render() {
        return (
            <ChildOne >
        );
    }
}

export class ChildOne extends React.Component {
    constructor(props) {
        super(props);
    } 

    render() {
        return (
            <ChildTwo />
        );
    }
}

export class ChildTwo extends React.Component {
    constructor(props) {
        super(props);
    } 

    render() {
        return(
            <ChildThree />
        );
    }
}

export class ChildThree extends React.Component {
    constructor(props) {
        super(props);
    }

    addEvent() {
        // how to call loadData() function, which is included in the highest parent
    }

    render() {
        return(
            <Button onCLick={this.addEvent.bind(this)} />
        );
    }
}

```

是的。我们可以通过 props 将请求发送到层次结构的顶部。但是有没有什么方法我们可以用另一种方式来做到这一点，除非通过层次结构。先感谢您。

Answer 1

react 方式是通过 props 将父组件的功能向下传递。您提到这是您的回复。

基本上，你的 parent 会有一个函数，它会传递给 child ，然后触发它。