BlazerでURLクエリを受け取る

BlazerでURLクエリを受け取りたい。

準備

NuGetから「Microsoft.AspNetCore.WebUtilities」をインストールする インストールする際には最新のものではなくプロジェクト内で既に使われているASP .NET Coreのバージョンにあわせること。

実装

Hello.cshtml

@page "/hello"
@implements IDisposable
@inject Microsoft.AspNetCore.Blazor.Services.IUriHelper UriHelper

<h1>Hello @Type World!</h1>

<MainMenu />

@functions {
    private string Type { get; set; }

    protected override void OnInit()
    {
        RefreshType();
        UriHelper.OnLocationChanged += OnLocationChanges;
    }

    private void OnLocationChanges(object sender, string location) => RefreshType();

    private void RefreshType()
    {
        var uri = new Uri(UriHelper.GetAbsoluteUri());
        Type = Microsoft.AspNetCore.WebUtilities
            .QueryHelpers.ParseQuery(uri.Query).TryGetValue("type", out var type) ? type.First() : "";
        this.StateHasChanged();
    }

    public void Dispose()
    {
        UriHelper.OnLocationChanged -= OnLocationChanges;
    }
}

関連項目

• Blazorで画面をマニュアル更新する
• Visual Studio for MacでBlazorを使う‎