blankor中的OnInitializedAsync（）

Question

我在代码中使用了OnInitializedAsync（）。在那个钩子中，我正在获取数据。在标记中，我检查了数据是否为空。但是我发现检查的数据在onInitalizedAsync（）触发之前执行。同时，在也获取数据之后，执行检查的数据。

我已经检查了blazor文档，但是却很难找到它最初触发的原因。

<Component1>
  @if (Data != null)
      {
        @foreach (var item in Data) {
             <Component2>
        }
       }
</Componet1>

@code{
  protected override async Task OnInitializedAsync() {
       Data = //data from dataBase
  }
}

我仅需要在提取数据后执行检查的数据。谁能指导我解决此问题？

谢谢，

Kesavan

Answer 1

首先要进行数据检查，因为必须在OnInitializedAsync方法之前进行渲染。因此，如果OnInitializedAsync花费很长时间加载数据，则用户已经看到了一些东西，而不仅仅是空白页面。

为什么只在获取数据后为什么要检查数据？

作为一种解决方法，您可以创建局部变量bool dataIsLoaded = false;，只有在将数据加载到OnInitializedAsync后才能将其设置为true。然后在数据检查中执行：@if (dataIsLoaded && Data != null)

Answer 2

OnInitializedAsync方法适用于异步操作，当异步操作完成且数据可用时，需要重新呈现组件。当执行OnInitializedAsync方法时，异步操作开始（await ....）时，控制权交给Blazor运行时，并且Blazor开始渲染视图。但是您的Data对象尚未填充数据。它为null，并且如果您不检查此约束，则会触发错误。

异步操作完成后，控制权被传递回OnInitializedAsync方法，该方法将继续执行下一个代码（如果存在）。此外，OnInitializedAsync方法调用StateHasChanged方法以再次重新呈现您的组件。这次，您的数据中填充了数据；它不为null，您可以使用foreach遍历Data对象。

如果改用OnInitialized方法，则应在对数据存储的调用返回（同步阻塞操作）后开始视图的呈现。在这种情况下，根本不需要检查。校验码永远不会到达Data != null的部分。你知道为什么吗？

您了解此代码的作用吗？

<Component1>
  @if (Data != null)
      {
        @foreach (var item in Data) {
             <Component2>
        }
       }
</Componet1>

这可能有效，但设计错误。提出一个新问题，让社区在此方面为您提供帮助...