.NET 6 Blazor WASM预渲染模式下MudTable与MudHidden异常

问题背景 #

使用.NET 6 + MudBlazor 6.0.11的预渲染模式时，出现两个异常：MudHidden始终处于隐藏状态，MudTable无法展示数据，且已在Program.cs中完成MudServices的配置。

针对性解决方案 #

1. 修复MudHidden持续隐藏问题 #

预渲染阶段组件状态初始化不完整是常见诱因，可通过组件生命周期方法修正状态同步逻辑：

protected override async Task OnAfterRenderAsync(bool firstRender)
{
    if (firstRender)
    {
        // 根据业务需求设置Hidden绑定的状态变量
        IsHidden = false;
        StateHasChanged();
    }
    await base.OnAfterRenderAsync(firstRender);
}

确保MudHidden的Hidden参数绑定到可动态修改的变量，而非硬编码为true。

2. 解决MudTable无数据问题 #

预渲染时异步数据未加载完成会导致表格空显示，可在初始化阶段判断渲染环境，延迟数据加载：

protected override async Task OnInitializedAsync()
{
    // 跳过预渲染阶段的数据加载，等待客户端交互后执行
    if (!HttpContextAccessor.HttpContext.Request.Path.StartsWithSegments("/_blazor"))
    {
        return;
    }
    // 执行实际的数据加载逻辑
    TableDataSource = await YourDataService.FetchDataAsync();
}

同时确保MudTable的Items参数绑定的集合在数据更新后，调用StateHasChanged()触发组件刷新。

3. 验证服务配置完整性 #

已添加的AddMudServices配置无问题，但需确认Blazor服务注册正确：

builder.Services.AddRazorPages();
builder.Services.AddServerSideBlazor()
    .AddHubOptions(options =>
    {
        options.MaximumReceiveMessageSize = 1024 * 1024 * 10;
    });
builder.Services.AddMudServices(configuration =>
{
    configuration.SnackbarConfiguration.PositionClass = Defaults.Classes.Position.BottomRight;
    configuration.SnackbarConfiguration.HideTransitionDuration = 100;
    configuration.SnackbarConfiguration.ShowTransitionDuration = 100;
    configuration.SnackbarConfiguration.VisibleStateDuration = 3000;
    configuration.SnackbarConfiguration.ShowCloseIcon = false;
});

内容的提问来源于stack exchange，提问作者Amir Mohammadi