MudBlazor 6.11.0中如何默认或通过按钮展开MudDataGrid的HierarchyColumn？

核心问题说明 #

GroupExpanded="true"和ExpandAllGroups()方法仅针对**分组列（Grouping Column）**生效，无法直接控制HierarchyColumn的展开状态。要实现HierarchyColumn的默认展开和批量展开，需要手动操作DataGrid的行对象来设置展开状态。

实现方案 #

1. 默认展开所有Hierarchy行：在数据加载完成后，遍历DataGrid的所有行，将每行的Expanded属性设为true。
2. 批量展开/折叠按钮逻辑：替换原有的分组操作方法，改为遍历行对象设置Expanded属性。

修改后的完整代码 #

@using System.Net.Http.Json
@using MudBlazor.Examples.Data.Models
@inject HttpClient httpClient

<MudDataGrid @ref="dataGrid" Items="@Elements">
    <Columns>
        <HierarchyColumn T="Element" />
        <PropertyColumn Property="x => x.Number" Title="Nr" />
    </Columns>
    <ChildRowContent>
        <MudCard>
            <MudCardContent>
                <MudText>This element is number @context.Item.Number</MudText>
            </MudCardContent>
        </MudCard>
    </ChildRowContent>
    <PagerContent>
        <MudDataGridPager T="Element" />
    </PagerContent>
</MudDataGrid>

<div class="d-flex flex-wrap mt-4">
    <MudButton OnClick="@ExpandAllHierarchyRows" Color="@Color.Primary">Expand All</MudButton>
    <MudButton OnClick="@CollapseAllHierarchyRows" Color="@Color.Primary">Collapse All</MudButton>
</div>

@code { 
    private IEnumerable<Element> Elements = new List<Element>();
    MudDataGrid<Element> dataGrid;
    private bool _isFirstRender = true;

    protected override async Task OnInitializedAsync()
    {
        Elements = await httpClient.GetFromJsonAsync<List<Element>>("webapi/periodictable");
    }

    protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        if (_isFirstRender && Elements.Any())
        {
            // 数据加载完成后默认展开所有Hierarchy行
            foreach (var row in dataGrid.Rows)
            {
                row.Expanded = true;
            }
            _isFirstRender = false;
            StateHasChanged();
        }
        await base.OnAfterRenderAsync(firstRender);
    }

    void ExpandAllHierarchyRows()
    {
        if (dataGrid == null) return;
        foreach (var row in dataGrid.Rows)
        {
            row.Expanded = true;
        }
        StateHasChanged();
    }

    void CollapseAllHierarchyRows()
    {
        if (dataGrid == null) return;
        foreach (var row in dataGrid.Rows)
        {
            row.Expanded = false;
        }
        StateHasChanged();
    }
}

关键说明 #

• 使用OnAfterRenderAsync确保DataGrid已渲染并加载完数据后再设置行的展开状态，避免空引用问题。
• 通过dataGrid.Rows获取所有行对象，直接修改Expanded属性来控制Hierarchy行的展开/折叠状态。
• 调用StateHasChanged()触发UI更新，确保修改后的状态及时渲染到页面。

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