Blazor 不会重新渲染以显示我的对象

Question

我刚刚开始了一个新的 blazor 项目（WASM，而不是服务器）来了解它是如何工作的，所以如果我似乎在做一些愚蠢的事情，请原谅我的无知。

使用 .NET 5

该页面应该调用本地托管的 API（我已经检查过该 API 是否有效），然后在我正在加载的页面上显示它获得的信息。阅读文档和 Blazor 组件生命周期表明，使用 OnInitializedAsync() 可能是我最好的选择，因为我想拨打电话，但不会阻塞网页并看到我在这里使用 ParameterAttribute，我需要等到首先绑定参数（至少在我的理解中）。

我得到的是调用完成后，它应该会导致页面重新呈现，在页面上显示我的对象信息。

这是我的GameDetails.razor 文件：

@page "/gamedetails/{gameId:int}"
@inject HttpClient HttpClient
@inject NavigationManager NavManager

<h1>Game Details</h1>

@if (_game != null)
{
    <p>
        Id: @_game.Id<br />
        Title: @_game.Title<br />
        Year: @_game.Year<br />
        Developer: @_game.Developer<br />
        Publisher: @_game.Publisher<br />
        Region: @_game.Region<br />
        Region Code: @_game.ShortRegion <br />
        Keymaps: @_game.KeyMaps
    </p>
}

@code {
    [ParameterAttribute]
    public int gameId { get; set; }

    private GameSearchResult _game;

    protected override async Task OnInitializedAsync()
    {
        string url = $"Mappings?gameId={gameId}";
        _game = await HttpClient.GetFromJsonAsync<GameSearchResult>(url, new JsonSerializerOptions()
        {
            PropertyNamingPolicy = JsonNamingPolicy.CamelCase
        });
    }
}

应该发生的情况是，您单击不同页面上的卡片，然后导航到此页面，然后从 API 请求信息以显示在页面上。

实际发生的是页面加载，但没有显示我的信息。我已经调试并看到信息被成功检索并存储在我的名为_game 的GameSearchResult 对象中，所以我的猜测是该页面没有像我想象的那样重新呈现。

我已尝试致电StateHasChanged()，正如一些人在其他地方建议的那样尝试强制重新渲染，但仍然没有。

我应该怎么做才能获得想要的行为？我可以接受整个通话也是同步的，这不会打扰我。

Answer 1

首先，OnInitializedAsync 在应用程序生命周期内每个页面组件只会运行一次，因此不是响应参数更改的好地方。

见：https://blazor-university.com/components/component-lifecycles/

其次，尝试将 [ParameterAttribute] 更改为 [Parameter]

[Parameter]
public int gameId { get; set; }

protected override async Task OnParametersSetAsync()
{
    string url = $"Mappings?gameId={gameId}";
    _game = await HttpClient.GetFromJsonAsync<GameSearchResult>(url, new JsonSerializerOptions()
    {
        PropertyNamingPolicy = JsonNamingPolicy.CamelCase
    });
}