MudBlazor中MudExpansionPanel无法显示内容的问题排查

针对你遇到的代码在Try MudBlazor正常运行，但本地.NET6项目中MudExpansionPanel内容无法渲染（无控制台报错）的情况，可按以下步骤排查解决：

• 检查MudBlazor基础配置
  确认项目是否正确初始化MudBlazor：

  • 在Program.cs中添加服务：builder.Services.AddMudServices();
  • 在_Imports.razor中引入命名空间：@using MudBlazor;
    Try MudBlazor会自动配置这些，但本地项目容易遗漏，这是最常见的原因。

• 显式指定内容区域
  尝试将MudExpansionPanel内的内容包裹在<MudExpansionPanelContent>组件中，部分MudBlazor版本对显式内容组件有依赖：

  <MudExpansionPanel Text="Group 1" IsInitiallyExpanded="true" DisableGutters="true">
      <MudExpansionPanelContent>
          <MudTable Items="@Roles" MultiSelection="true" Elevation="0">
              <ColGroup>
                  <col style="width: 80px;" />
              </ColGroup>
              <RowTemplate>
                  <MudTd>@context</MudTd>
              </RowTemplate>
          </MudTable>
      </MudExpansionPanelContent>
  </MudExpansionPanel>
  

• 排查样式冲突
  本地项目的自定义CSS可能覆盖了MudBlazor的默认样式，导致内容被隐藏：

  1. 暂时移除项目中的自定义CSS文件，测试是否恢复正常。
  2. 若确认是样式冲突，可给MudExpansionPanel添加强制显示的样式：

     .custom-expansion .mud-expansion-panel-content {
         display: block !important;
         height: auto !important;
     }
     

     然后给组件添加类：<MudExpansionPanel Class="custom-expansion" ...>

• 触发组件重新渲染
  Blazor的状态检测可能未触发，导致内容未渲染：

  1. 将Roles字段改为可触发状态变化的类型，比如ObservableCollection<string>：

     private ObservableCollection<string> Roles = new() { "Owner", "Editor" };
     

  2. 或者在OnInitialized中手动调用状态更新：

     protected override void OnInitialized()
     {
         Roles = new List<string> { "Owner", "Editor" };
         StateHasChanged();
     }
     

• 清理项目缓存
  清理项目的bin和obj文件夹，重新构建项目；同时强制刷新浏览器（Ctrl+Shift+R），清除前端缓存。

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