...

/

Cascading Values and Parameters

Cascading Values and Parameters

Learn how to pass cascading values to a hierarchy of Razor components.

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

Passing cascading parameters to a Razor components hierarchy

Press + to interact
Cascading parameters flow
Cascading parameters flow
...