Blazor中如何从SfGrid及GridColumn调用带参数的函数

要在SyncFusion SfGrid里调用和当前行绑定数据相关的自定义方法，核心是用列模板获取当前行的上下文对象，不能直接写死取集合第一条数据。

具体实现 #

SfGrid的自定义列渲染需要用到GridColumn的Template模板段，模板内的内置变量context对应当前渲染行绑定的实体对象，和你原生写foreach时拿到的equipamento是同一个东西，直接取对应属性传参即可。

修正后和原生效果完全对齐的SfGrid代码 #

@* 排序直接绑定在DataSource上，和原生OrderByDescending逻辑一致 *@
<SfGrid DataSource="@equipamentos.OrderByDescending(e => e.Nome)" AllowPaging="true" AllowSorting="true" AllowFiltering="true">
    <GridPageSettings PageSize="20"></GridPageSettings>
    <GridColumns>
        <GridColumn 
            Field=@nameof(Equipamento.Nome) 
            HeaderText="Nome" 
            TextAlign="TextAlign.Center" 
            Width="15%">
            @* 对应原生表格Nome列的加粗、点击查看详情逻辑 *@
            <Template>
                var currentRow = (Equipamento)context;
                <span style="font-weight: bold; cursor: pointer;" 
                    @onclick="() => MostrarInfoEquipamento(currentRow.IdEquipamento)">
                    @currentRow.Nome
                </span>
            </Template>
        </GridColumn>
        <GridColumn 
            Field=@nameof(Equipamento.Marca) 
            HeaderText="Marca" 
            TextAlign="TextAlign.Center" 
            Width="15%">
        </GridColumn>
        <GridColumn 
            Field=@nameof(Equipamento.Modelo) 
            HeaderText="Modelo" 
            TextAlign="TextAlign.Center" 
            Width="15%">
        </GridColumn>
        <GridColumn 
            Field=@nameof(Equipamento.Utilizador)
            HeaderText="Utilizador" 
            TextAlign="TextAlign.Center" 
            Width="15%">
        </GridColumn>
        <GridColumn 
            Field=@nameof(Equipamento.Observacoes)
            HeaderText="Observações" 
            TextAlign="TextAlign.Center" 
            Width="30%">
        </GridColumn>
        <GridColumn
            HeaderText="Nº Int"
            TextAlign="TextAlign.Center"
            Width="10%">
            <Template>
                var currentRow = (Equipamento)context;
                @* 传当前行的设备ID，和原生foreach里的传参逻辑完全一致 *@
                @NumeroIntervencoesCount(currentRow.IdMigracao)
            </Template>
        </GridColumn>
    </GridColumns>
</SfGrid>

可选性能优化 #

你现在用的NumeroIntervencoesCount方法每渲染一行就要全量遍历所有干预记录，数据量上来之后会卡顿，可以改成一次性预计算所有设备对应的干预数量，渲染时直接查结果：

// 组件初始化、加载完equipamentos和intervencoes数据后调用一次即可
private Dictionary<int, int> _intervCountMap = new();
private void BuildIntervCountMap()
{
    _intervCountMap = intervencoes
        .GroupBy(i => i.IdEquipamento)
        .ToDictionary(g => g.Key, g => g.Count());
}

// 优化后的计数方法，不用每次循环全量数据
public string NumeroIntervencoesCount(int equipamentoAtual)
{
    return _intervCountMap.TryGetValue(equipamentoAtual, out var count) ? count.ToString() : "0";
}

小提示 #

如果觉得每次把context强转成Equipamento麻烦，可以给SfGrid标签加@typeparam TItem="Equipamento"指定绑定的实体类型，模板里的context会自动识别成强类型，不用手动转换。

内容的提问来源于stack exchange，提问作者Gonçalo Nogueira