Question

我有一项将项目列表返回到前端的服务。服务方法实现为异步/等待方法。当我从OnInitializedAsync()方法的前端调用服务时，可以看到列表正在填充。然后，当需要渲染页面时，“项目列表”为空，而我的组件未渲染。为什么会这样？

@using ProjCore.Services.Interfaces

@inject IProjectService ProjectService

<div>
    @foreach (var pro in Projects)
    {
        <h2>Sanitycheck header...</h2>
        <ProjectContainer Project="pro" />
    }
</div>

@code {
    private List<ProjectModel> Projects = new List<ProjectModel>();

    protected override async Task OnInitializedAsync()
    {
        var Projects = await ProjectService.GetProjects();
    }
}

在我看来，以上所述应该可行。

Answer 1

首先，这不应是私有的：

private List<ProjectModel> Projects = new List<ProjectModel>();

将其设置为公开或受保护。其次，您将GetProjects的结果设置为局部变量，而不是html读取的Property。也许尝试类似的东西：

Projects = await ProjectService.GetProjects();

或者如果GetProjects不返回列表，则为这种形式；

Projects = await ProjectService.GetProjects().ToList();

主要是摆脱“ var”。您不需要StateHasChanged（）。

吉姆

Answer 2

您需要调用 StateHasChanged 方法，以便它知道重绘UI

protected override async Task OnInitializedAsync()
{
    Projects = await ProjectService.GetProjects();
    await InvokeAsync(StateHasChanged);
}

编辑：是的，没有注意到 var -您不需要这样做，也可以创建局部变量

关于StateHasChanged的说明-事件处理程序不需要它，因为它在它们的末尾会自动调用，尽管我认为您确实需要在生命周期方法（如OnInitialized）上使用它错了

Blazor foreach在OnInitializedAsync调用后不呈现元素

2 个答案: