如何在 Blazor 中长时间运行的 API 调用期间动态显示用户反馈？

在 Blazor 中的 API 调用期间动态显示用户反馈

在 Blazor 中，处理长时间运行的 API 调用需要向用户提供反馈，例如显示等待光标或“旋转”图像。本文介绍了实现此目的的两种方法：

选项 1：使用 Task.Delay(1)

• 创建异步方法。
• 使用await Task.Delay(1);或等待 Task.Yield();刷新更改。

private async Task AsyncLongFunc()    // this is an async task
{
    spinning=true;
    await Task.Delay(1);      // flushing changes. The trick!!
    LongFunc();               // non-async code
    currentCount++;
    spinning=false;
    await Task.Delay(1);      // changes are flushed again    
}

选项 2：使用 Task.Run() （不适用于 WebAssembly）

创建一个包含长操作的任务:

async Task AsyncLongOperation()    // this is an async task
{
    spinning=true;
    await Task.Run(()=> LongOperation());  //<--here!
    currentCount++;
    spinning=false;
}

效果预渲染

在 Blazor Server 应用程序中，由于预渲染，微调器可能不会显示。要解决此问题，请在 OnAfterRender 中执行长操作，而不是 OnInitializedAsync。

protected override async Task OnAfterRenderAsync(bool firstRender)
{
    if (firstRender)
    {            
        await Task.Run(()=> LongOperation());//<--or Task.Delay(0) without Task.Run
        StateHasChanged();
    }
}

有关有效旋转器实现的更多见解，请探索开源项目 BlazorPro.Spinkit。

以上是如何在 Blazor 中长时间运行的 API 调用期间动态显示用户反馈？的详细内容。更多信息请关注PHP中文网其他相关文章！