[React]Advice on how to update parent state from grandchild[solved]

Hi everyone,:blush:

I am back again to ask some advice. Now I am working on a form to input all the questions, answers, etc for the test on the quiz application I am working on. And, as the teachers will have to be able to see how the input questions and answers look like, I need to make a preview of it. The problem I have with it is that I have to update the state of my Quiz component from its grandchild component in order to update its great grandchild. To be more clear, I am working on a part of my application which looks like this :
So I need my Form component to interact with my Quiz component which will interact with my DisplayQuizz component. I tried to do it with a callback but it’s not working. The callback function update the form component state and not the Quiz component state.:persevere:

So I was wondering do I have to use Redux or Context in this case (and face this hardship even if I am very affraid of it) or can I do it without it ?

What is your opinion on a case like this ?

Thanks in advance for your responses.:blush:

EDIT : Thank you all and sorry to have bothered all of you. It’s not working because of a syntax mistake. So this topic is closed now.

Give the Quiz Component a function for updating it’s state (don’t forget to bind the function to this in the Quiz class constructor). Then send the function as a prop to Teacher and forward it as a prop to Form.

updateQuizState() {
render() {
    return <Teacher quizStateFunction={this.updateQuizState} />

    return <Form quizStateFunction=props.quizStateFunction />

    return (
            <input type="text" value={props.quizStateFunction} />
            // OR depending on what tag it's being attached to
            <button onClick={(event) => {

Thread the state as a prop through Quiz > Teacher > Form > DisplayQuizz in a similar way.

Or, ya know, Redux.

Thank you for your response.:blush: In fact my callback is not working because I don’t update the right state.