☰

Blazor: レイアウトからパラメータにアクセスする 質問する

tag-icon • tag-icon blazor blazor-server-side
Blazor: レイアウトからパラメータにアクセスする 質問する

レイアウトからページのルートパラメータにアクセスするにはどうすればよいですか?

次のようなルート パラメータを受け入れるページがあります。

@page /my-page/{Slug}

Slug共有レイアウトでマークアップをレンダリングするときにの値にアクセスする必要があります。

レイアウト ファイルで次のように実装してみましたOnParametersSetが、値が設定されません。ページ レベルでのみ割り当てられます。

@inherits LayoutComponentBase

<div class="sidebar">
    <NavMenu />
</div>

<div class="main">
    <div class="top-row px-4">
            @this.Slug   <<<<------ display the parameter
    </div>

    <div class="content px-4">
        @Body
    </div>
</div>

@code
{
    [Parameter]
    public string Slug { get; set; }

    protected override void OnParametersSet()
    {
        // Slug is always null :-/
    }
}

ベストアンサー1

CascadingParameters を介して RouteData をすべてのコンポーネントで利用できるようにすることができます。App.razor で、次の操作を実行します。

<Router AppAssembly="@typeof(Program).Assembly">
    <Found Context="routeData">
        <CascadingValue Value="@routeData">
            <RouteView RouteData="@routeData" DefaultLayout="@typeof(MyLayout)" />
        </CascadingValue>
    </Found>
</Router>

次に、RouteData が必要なすべてのコンポーネントに以下を追加します。

@code
{
    [CascadingParameter]
    RouteData RouteData { get; set; }
}

値は自動的に入力されます。

おすすめ記事