2

在 Blazor 服务器组件中，我用于OnInitializedAsync()连接来自注入服务的事件：

protected override async Task OnInitializedAsync()
{
    _fooRepository.SomethingChanged += OnSomethingChanged;
    await Refresh();
}

public void Dispose()
{
    _fooRepository.SomethingChanged -= OnSomethingChanged;
}

private async Task Refresh()
{
    this.FooData = await LoadDataFromRepository();
}

不幸的是，根据文档，该OnInitializedAsync方法可能会被调用两次，具体取决于渲染模式。

我发现了一些建议OnAfterRenderAsync用于初始化逻辑的示例：

protected override async Task OnAfterRenderAsync(bool firstRender)
{
    if (firstRender)
    {
        _fooRepository.SomethingChanged += OnSomethingChanged;
        await Refresh();
    }
}

[... Dispose and Refresh as above... ]

使用OnAfterRenderAsync代替时有缺点OnInitializedAsync吗？在我看来，我应该放弃OnInitializedAsync并默认OnAfterRenderAsync改为。

4

1 回答 1

3

了解预渲染发生了什么很重要。

页面被渲染两次：

  1. 一次由服务器构建一个静态版本的页面。这会加载并正确处理所有组件。
  2. blazor.server.js当通过在浏览器会话中运行建立 SignalR 会话时，Blazor Hub 会话的第二次。

要点：

  1. 这两个负载是完全独立的，注册/注销事件处理程序没有泄漏。
  2. 这仅在应用程序首次加载时发生。之后每页加载一次。
  3. OnInitialized{Async}似乎是注册事件处理程序的自然场所，但我想不出一个令人信服的理由不把它们放进去OnAfterRender{Async}，除了你必须记住只在第一次渲染时这样做。只是看起来不太对！

如果您担心两次渲染页面的加载时间，请保持着陆页简短而美观。

最后的评论。在您的代码中，执行数据的初始加载，然后注册SomethingChanged事件。

于 2021-09-29T16:32:52.420 回答