Blazor 数据加载时显示 Loading 提示的方法

Blazor中实现Loading提示需用bool isLoading状态控制UI显隐，加载前设true并调用StateHasChanged()，异常或完成后设false；可封装为LoadingWrapper组件自动管理任务状态；首次加载应在OnInitializedAsync中手动控制开关时机，并结合CancellationToken防重复提交。

在 Blazor 中实现数据加载时显示 Loading 提示，核心是利用组件状态（bool isLoading）控制 UI 的显隐，并配合异步操作的生命周期合理设置开关时机。

使用布尔状态 + 条件渲染

最常用也最直接的方式：定义一个 isLoading 字段，在调用异步方法前后手动更新它，再用 @if (isLoading) { ... } 控制提示内容。

在 @code 块中声明：private bool isLoading = false;
在加载数据前设为 true，比如：isLoading = true; StateHasChanged();（确保 UI 立即响应）
在 try 块末尾或 finally 中设回 false，避免异常导致 Loading 残留
模板中写：@if (isLoading) { Loading... } 或套个骨架屏、Spinner 组件

封装成可复用的 Loading 包裹组件

把 Loading 逻辑抽离成独立组件（如 LoadingWrapper.razor），通过参数接收任务和子内容，自动管理状态。

接受一个 Task 参数（如 [Parameter] public Task? DataTask { get; set; }）
内部用 @if (DataTask == null || DataTask.IsCompleted == false) 判断是否正在加载
子内容用 [Parameter] public RenderFragment? ChildContent { get; set; } 接收，只在加载完成时渲染
用法示例：数据内容