I'd like to have a fluent communication between components via DynamicComponent in Blazor. Thus I'd like to know whether its possible to pass a function to a DynamicComponent since now it doesn't know that the would be rendered components need a function to fully operate. All suggestions are welcome.
Index.razor
@page "/"
/*This is where I'd like for all of my components to get rendered cleanly*/
<DynamicComponent Type="selectedType" /*Here I'd like to pass a function "GoToComponent"*/ />
@code {
public void GoToComponent(string name)
{
selectedType = Type.GetType($"Namespace.Pages.{name}");
}
}
LandingComponent.razor
<p @onclick="() => OnClickFunction.InvokeAsync("First")">GO TO FIRST</p>
<p @onclick="() => OnClickFunction.InvokeAsync("Second")">GO TO SECOND</p>
@code {
[Parameter] public EventCallback<string> OnClickFunction { get; set; }
}
FirstComponent.razor
<p @onclick="() => OnClickFunction.InvokeAsync("Landing")">GO TO LANDING</p>
<p @onclick="() => OnClickFunction.InvokeAsync("Second")">GO TO SECOND</p>
@code {
[Parameter] public EventCallback<string> OnClickFunction { get; set; }
}
SecondComponent.razor
<p @onclick="() => OnClickFunction.InvokeAsync("First")">GO TO FIRST</p>
<p @onclick="() => OnClickFunction.InvokeAsync("Landing")">GO TO LANDING</p>
@code {
[Parameter] public EventCallback<string> OnClickFunction { get; set; }
}
Here's a revised
Landing.razor
.First
andSecond
should be similar.And Index: