How to communicate between 3 nested components of blazor C# in two-way binding asp.net core (from parent to its grandchild vice versa)

Question

I need to communicate between 3 components in blazor in the code behind.

• Parent component has a (submit button) button click event, in that code behind I need to call the child-1 component by passing some parameter and waiting for its response as bool value in return .
• The child-1 component communicate with child-2 by invoking the dialog popup with confirm button .
• When user clicks the confirm button in child-2 component I need to send response back to child-1 as status = true else false.
• Then the child-1 returns the response from child-2 to the parent as status=true

Note: The Child-1 component acts as intermediate it doesn't have any UI elements

This is the concept, I don't how to call the child-1 component in the code behind of parent

Example: [In Parent Component]

<button @onclick="callChildOne">Submit<button/>

void callChildOne(){
// i need to call child-1 here and pass the parameter status
// i need help in writing this code
}

REFER THIS IMAGE FOR BETTER UNDERSATNDING

Answer 1

I founded the case and came up with answer in terms of blazor. Refer below example

Child2.razor

@code{//some code}

Child1.razor

//No UI, only methods in code behind
    @code{
       public void Show()
       {
        // TODO actual implementation for calling child 2 component
       }
    }

Parent.razor

<button @onclick="callChildOne">Submit<button/>

@*Add a @ref to the component *@
<Child1 @ref="childObj"></Child1 >

@code {
    //Hold the reference to the component
    private Child1 childObj;

    // Call the public methods of the component
    private void callChildOne() => childObj.Show();    
}

This is how I mapped relationship with 3 components without any service. I read this example from blog of Blazor here