在 Blazor 中返回字符串答案

【问题标题】：Return string in Blazor在 Blazor 中返回字符串
【发布时间】：2021-11-14 00:50:15
【问题描述】：

我有一个从 DataTable 创建 html 表的函数。我附上了下面的代码。现在我的问题是，如何在 Blazor 应用程序中将字符串转换为 HTML 代码？

感谢您的努力。 :)

public static string ConvertDataTableToHtml(DataTable dt)
    {
        string html = "<table>";
        //add header row
        html += "<tr>";
        for (int i = 0; i < dt.Columns.Count; i++)
            html += "<td>" + dt.Columns[i].ColumnName + "</td>";
        html += "</tr>";
        //add rows
        for (int i = 0; i < dt.Rows.Count; i++)
        {
            html += "<tr>";
            for (int j = 0; j < dt.Columns.Count; j++)
                html += "<td>" + dt.Rows[i][j].ToString() + "</td>";
            html += "</tr>";
        }
        html += "</table>";
        return html;
    }

【问题讨论】：

根本不要创建这样的字符串。请改用 Razor 语法。您当前的代码甚至没有生成有效的 HTML - 该 DataTable 中的任何特殊字符或恶意脚本内容最终都会出现在最终的 HTML 中。充其量，其中一个单元格中的< 或> 最终会弄乱表格。最坏的情况是，存储在表中的任何 Javascript 都会被执行
好的，我会试试的，谢谢。
当所有 ASP.NET Core 示例都使用 Razor 时，为什么你首先尝试创建一个字符串？

标签： html datatable blazor converters

【解决方案1】：

无论你想做什么，停下来。这不是办法。您必须接受 Blazor 的出色表现。

它应该看起来像（我不是在测试这个，只是为了向你展示这个想法）：

TableComponent.razor

<table>
    <thead>
            <tr>
            @for (int i = 0; i < dt.Columns.Count; i++)
            {
                <td>@dt.Columns[i]</td>
            }
            </tr>
    </thead>
    <tbody>
        //add rows
        @for (int i = 0; i < dt.Rows.Count; i++)
        {
            <tr>
            @for (int j = 0; j < dt.Columns.Count; j++)
            {
                <td>@dt.Rows[i][j].ToString()</td>
            }
        }
    </tbody>
</table>

@code {
    [Parameter]
    DataTable dt {get; set;}
}

ParentComponentOrPage.razor

<TableComponent dt="@MyData"/>

@code
{
    DataTable MyData;  // Do something in override OnInitializedAsync  to fill your table.
}

看看你的字符串构建代码，看看性感甜美的 Blazor 等价物，就知道微软在过去几年里做了最酷的计算！ :D

【讨论】：

一些修饰建议：dt 应该是 DataTable ，属性通常与其类型具有相同的名称。而"@MyData" 可以只是"MyData"
是的，你是对的。我使用了dt，所以 OP 可以将他所拥有的内容映射到我所做的事情上。至于@MyData，尽管有些习惯很难改掉。实际上，我之前更喜欢使用@ 表单，因为它使变量弹出更多——我真的不喜欢将变量名放在引号中。我建议 OP 进行您建议的更改。