Cascading Values and Parameters
Explore how to implement cascading values and parameters in Blazor to pass data across multiple nested Razor components without direct parameter passing. Learn to wrap components with CascadingValue elements and consume them with the CascadingParameter attribute for dynamic component interaction.
We'll cover the following...
We'll cover the following...
Cascading values in Blazor allow us to set parameters in any eligible element in the component hierarchy and not only in the direct descendant of a particular component. To demonstrate how these work, we have the following project setup. In this project, we are passing cascading values to the hierarchy of Razor components and we are consuming it in a specific component.
<Router AppAssembly="@typeof(App).Assembly">
<Found Context="routeData">
<RouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)" />
<FocusOnNavigate RouteData="@routeData" Selector="h1" />
</Found>
<NotFound>
<PageTitle>Not found</PageTitle>
<LayoutView Layout="@typeof(MainLayout)">
<p role="alert">Sorry, there's nothing at this address.</p>
</LayoutView>
</NotFound>
</Router>
Blazor cascading parameters demo
...