当子组件嵌套了多个父组件时，从子组件调用超级父函数

Question

Lets assume a React component is having multiple parents. When I wanted to call to a function of the supper parent(The highest level component). How can I do that. Please see the sample code.

```

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)} />
        );
    }
}

```

Yeah. we can send the request via the props to the top of the hierarchy. But is there any method we can do it in another way unless going through the hierarchy. Thank You in advance.

Answer 1

The react way is that you pass functionality from parent components down through props. You mentioned this is your reply.

Basically your parent would have a function which it passes down to a child which then triggers it.