将Blazor含Razor标记的弹窗代码移至.cs文件时遇问题，求指导

你遇到的核心问题是：纯C#文件（.cs）不支持Razor语法编译，原来在Razor组件里的内联Razor标记会被编译器转换成RenderFragment，但直接放到.cs文件里会无法解析，导致弹窗内容失效。下面是两种可行的解决方案：

方案1：将弹窗内容封装为独立Blazor组件（推荐） #

这是最符合Blazor设计规范的方式，维护性也更好：

1. 新建一个Razor组件（比如DialogContent.razor），把原来的内联弹窗内容迁移进去：

<div style="padding: 2rem;">
    <p>弹窗内容示例</p>
    <RadzenButton Text="确认" Click="@Confirm" />
    <RadzenButton Text="取消" Click="@Cancel" Style="margin-left: 10px;" />
</div>

@code {
    [Parameter]
    public EventCallback OnConfirm { get; set; }

    [Parameter]
    public EventCallback OnCancel { get; set; }

    private async Task Confirm() => await OnConfirm.InvokeAsync();
    private async Task Cancel() => await OnCancel.InvokeAsync();
}

2. 在你的.cs文件中，通过DialogService打开这个组件：

private async Task ShowInlineDialog()
{
    var result = await DialogService.OpenAsync("弹窗标题", parameters => 
        new DialogContent 
        { 
            OnConfirm = EventCallback.Factory.Create(this, () => DialogService.Close(true)),
            OnCancel = EventCallback.Factory.Create(this, () => DialogService.Close(false))
        });

    if (result is bool isConfirmed && isConfirmed)
    {
        // 处理确认逻辑
    }
}

方案2：在C#中直接构建RenderFragment #

如果不想新增组件，可以用RenderTreeBuilder在.cs文件中手动构建弹窗内容的RenderFragment：

private async Task ShowInlineDialog()
{
    RenderFragment dialogContent = builder =>
    {
        int sequence = 0;
        // 构建外层容器
        builder.OpenElement(sequence++, "div", new { style = "padding: 2rem;" });
        
        // 添加文本内容
        builder.OpenElement(sequence++, "p");
        builder.AddContent(sequence++, "弹窗内容示例");
        builder.CloseElement();
        
        // 添加确认按钮
        builder.OpenComponent<RadzenButton>(sequence++);
        builder.AddAttribute(sequence++, "Text", "确认");
        builder.AddAttribute(sequence++, "Click", EventCallback.Factory.Create(this, () => DialogService.Close(true)));
        builder.CloseComponent();
        
        // 添加取消按钮
        builder.OpenComponent<RadzenButton>(sequence++);
        builder.AddAttribute(sequence++, "Text", "取消");
        builder.AddAttribute(sequence++, "Style", "margin-left: 10px;");
        builder.AddAttribute(sequence++, "Click", EventCallback.Factory.Create(this, () => DialogService.Close(false)));
        builder.CloseComponent();
        
        builder.CloseElement();
    };

    var result = await DialogService.OpenAsync("弹窗标题", dialogContent);
    // 处理返回结果
}

关键说明 #

• Razor组件中的内联标记（比如@<div>...</div>）会被Blazor编译器自动转换为RenderFragment类型的代码，但纯C#文件没有这个编译过程，所以直接写Razor标记会无效。
• 方案1的可维护性远高于方案2，尤其是弹窗内容复杂时，推荐优先使用。

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