blazor 客户端等待的方法在第一次等待后未执行答案

【问题标题】：blazor client awaited methods not executed after first awaitblazor 客户端等待的方法在第一次等待后未执行
【发布时间】：2020-10-20 16:11:09
【问题描述】：

OnAfterRenderAsync 在所有代码执行之前退出。只有我等待的第一行才会被执行。如果我将await Task.Delay(1000); 添加为第一行代码，则代码可以正常工作。如果我将它添加为最后一行代码，那么它没有任何影响，代码只返回到第一个等待执行。

protected override async Task OnAfterRenderAsync(bool firstRender)
{
    if (firstRender)
    {
        await JsRuntime.Create(Map, linkWithToken);
        foreach (var marker in Map.Markers)
        {
            await JsRuntime.AddMarker(Map, marker, new MouseEvent { LatLng = marker.Position });
        }
    }
}

我正在使用 .net 5 rc2 和 VS Preview 4。

【问题讨论】：

标签： c# asp.net-core async-await blazor-client-side blazor-webassembly

【解决方案1】：

我假设您尝试通过在 Blazor 组件中的元素中呈现地图来创建地图。当尝试运行绑定到元素的 javascript 时，您需要确保 DOM 中的元素在执行互操作调用之前存在，否则您的 javascript 将失败，因为 DOM 元素不存在。调用 await Task.Yield(); 可以让 Blazor 完成 DOM 元素的呈现，以确保它们在尝试与它们交互之前存在。

protected override async Task OnAfterRenderAsync(bool firstRender)
{
    if (firstRender)
    {
        await Task.Yield(); //wait a tick for Blazor to generate the DOM elements
        await JsRuntime.Create(Map, linkWithToken);
        foreach (var marker in Map.Markers)
        {
            await JsRuntime.AddMarker(Map, marker, new MouseEvent { LatLng = marker.Position });
        }
    }
}

【讨论】：