tsubakimoto/toumei-blazor で元々カラーコードはクエリパラメーターで受け取っていた。
ただ、パラメーターといっても1種類しかないので、パスパラメーター /palette/{カラーコード}
に変えることにする。
パスパラメーターを受け付けたい Razor コンポーネントにて以下の実装を行う。
@page
ディレクティブに省略可能なパスパラメーターを定義する@code
ディレクティブにパスパラメーターをセットするプロパティを定義する- パスパラメーターが指定されない場合は既定値をセットする
コードで説明すると下記となる。
@page "/palette/{color?}" // #1 @inject IJSRuntime JS @inject NavigationManager NavManager /* 中略 */ @code { // #2 [Parameter] public string Color { get; set; } protected override void OnParametersSet() { Color = Color ?? "000000"; // #3 } protected override async Task OnAfterRenderAsync(bool firstRender) { await JS.InvokeVoidAsync("CalcColor", Color); } }