Blazor .NET6项目中Blazorise DataGrid如何渲染HTML字符串为元素？

Blazorise DataGrid默认会自动转义HTML字符串，所以直接传入<a href="address">This is a link</a>这类文本时，会原样显示而不是渲染成链接。你可以通过以下两种方式解决：

方法1：使用列模板（推荐，更安全） #

如果数据里拆分了链接地址和文本（而非直接存储完整HTML），直接在DataGridColumn的Template中手动构建HTML元素：

<DataGrid TItem="YourDataModel" Data="@yourDataSource">
    <DataGridColumn Caption="链接">
        <Template>
            <!-- context代表当前行的数据项 -->
            <a href="@context.LinkUrl" target="_blank">@context.LinkText</a>
        </Template>
    </DataGridColumn>
    <!-- 其他列... -->
</DataGrid>

这种方式完全可控，还能避免XSS安全风险，是优先推荐的方案。

方法2：渲染已有HTML字符串（需注意安全） #

如果必须渲染预先拼接好的HTML字符串，需要将字符串转换为MarkupString类型（Blazor用来标识可直接渲染的HTML内容），然后在模板中输出：

方式A：在模板中直接转换 #

<DataGrid TItem="YourDataModel" Data="@yourDataSource">
    <DataGridColumn Caption="HTML内容">
        <Template>
            @((MarkupString)context.HtmlContent)
        </Template>
    </DataGridColumn>
</DataGrid>

方式B：使用Blazorise的Raw组件 #

也可以用Blazorise提供的Raw组件来渲染HTML字符串：

<DataGrid TItem="YourDataModel" Data="@yourDataSource">
    <DataGridColumn Caption="HTML内容">
        <Template>
            <Raw Content="@context.HtmlContent" />
        </Template>
    </DataGridColumn>
</DataGrid>

⚠️ 注意：直接渲染HTML字符串存在XSS攻击风险，如果HTML内容来自用户输入，一定要先做安全过滤，避免注入恶意代码。

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