如何在Fluent UI Blazor Wasm中实现带Id参数的编辑按钮

你需要用TemplateColumn来实现自定义操作列，因为PropertyColumn仅用于绑定显示属性，而TemplateColumn允许你添加交互元素比如按钮。以下是修改后的完整代码：

@inject NavigationManager NavManager

<FluentDataGrid Id="jobreferencerules" Items="@forecasts" TGridItem="MyClass">
    <PropertyColumn Title="Id" Property="@(c => c!.Id)" Sortable="true" Align="Align.Start" />
    <PropertyColumn Title="Group Code" Property="@(c => c!.Group.Pessoa.Cd_Pes)" Sortable="true" Align="Align.Start" />
    <PropertyColumn Title="Group Name" Property="@(c => c!.Group.Pessoa.Apelido)" Sortable="true" Align="Align.Start" />
    <PropertyColumn Title="Modal Code" Property="@(c => c!.Tipo_Modal_Imp_Exp.Cd_Tp_Modal)" Sortable="true" Align="Align.Start" />
    <PropertyColumn Title="Doc Code" Property="@(c => c!.Tipo_Doc_Cliente.ID_DC)" Sortable="true" Align="Align.Start" />
    <PropertyColumn Title="Doc Name" Property="@(c => c!.Tipo_Doc_Cliente.Nome_DC)" Sortable="true" Align="Align.Start" />
    <PropertyColumn Title="Status" Property="@(c => c!.Enabled)" Sortable="true" Align="Align.Start" />
    <PropertyColumn Title="Created By" Property="@(c => c!.User.Nome_Usuario)" Sortable="true" Align="Align.Start" />
    <PropertyColumn Title="Created Date" Property="@(c => c!.Insert_Date)" Format="dd-MM-yyyy" Sortable="true" Align="Align.Start" />
    
    <!-- 新增的编辑按钮列 -->
    <TemplateColumn Title="操作" Align="Align.Center">
        <FluentButton Appearance="Appearance.Primary" @onclick="() => Edit(context!.Id)">
            编辑
        </FluentButton>
    </TemplateColumn>
</FluentDataGrid>

@code {
    [Inject]
    private NavigationManager NavManager { get; set; } = default!;

    // 假设forecasts是你的数据源，MyClass是实体类
    private List<MyClass> forecasts = new();

    private void Edit(int id)
    {
        NavManager.NavigateTo($"/editjobreferencerules/{id}");
    }
}

关键说明： #

• TemplateColumn会自动将当前行的实体对象通过context变量暴露出来，你可以直接通过context.Id获取当前行的Id参数
• 按钮点击事件使用() => Edit(context!.Id)这种lambda表达式，确保传递的是当前行的Id值
• 要确保已经通过@inject或者属性注入的方式获取到NavigationManager实例，否则无法执行页面跳转

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