MudBlazor MudDataGrid单元格超链接添加及行编辑问题排查

一、TemplateColumn 中添加关联实体超链接跳转 Edit 页面 #

TemplateColumn 完全可以获取当前行数据，直接通过 @context 访问实体对象即可。以下是跳转至 Edit.razor 并携带关联实体 ID 的示例：

<MudDataGrid Items="@Products">
    <Columns>
        <TemplateColumn Title="关联分类">
            @{
                var currentProduct = context as Product;
                if (currentProduct?.RelatedCategory != null)
                {
                    <NavLink href=$"/Edit/{currentProduct.RelatedCategory.Id}">
                        @currentProduct.RelatedCategory.Name
                    </NavLink>
                }
            }
        </TemplateColumn>
        <!-- 其他业务列 -->
    </Columns>
</MudDataGrid>

核心逻辑：通过 @context 拿到当前行实体，直接访问关联属性，用 NavLink 生成带 ID 的跳转路径；如果需要编程式跳转，也可注入 NavigationManager 调用 NavigateTo($"/Edit/{id}")。

二、行编辑按钮不显示+编译错误解决 #

1. 编译错误：“Keyword, identifier, or string expected after verbatim specifier: @” #

这个错误是逐字字符串（@""）的语法误用导致的，常见场景：

• 错误嵌套 @，比如 @"@context.Id"
• @ 后未跟上合法标识符/关键字

修正方法：使用字符串插值替代错误写法，比如将 @"@context.Id" 改为 $"{context.Id}"，或直接使用 @context.Id 输出值。

2. 行编辑按钮不显示的问题 #

启用内置行编辑必须满足两个关键条件：

• 添加 EditCommandColumn（编辑按钮的载体，无此列则无编辑入口）
• 正确设置 EditMode 属性

示例正确代码：

<MudDataGrid Items="@Products" EditMode="DataGridEditMode.Form">
    <Columns>
        <EditCommandColumn /> <!-- 必须添加此列才会显示编辑按钮 -->
        <PropertyColumn Property="x => x.ProductName" Title="产品名称" />
        <!-- 其他业务列 -->
    </Columns>
    <EditFormContent>
        <MudForm>
            <MudTextField @bind-Value="@context.Item.ProductName" Label="产品名称" Required />
            <!-- 其他编辑字段 -->
            <div class="d-flex justify-end mt-3">
                <MudButton OnClick="@context.CancelEdit" Margin="Margin.Right">取消</MudButton>
                <MudButton OnClick="@context.SaveEdit" Color="Color.Primary">保存</MudButton>
            </div>
        </MudForm>
    </EditFormContent>
</MudDataGrid>

补充说明：ReadOnly="false" 是默认值，可省略；确保绑定的数据源（比如 Products）是可编辑集合（如 List<Product>，而非只读的 IEnumerable）。

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