Blazor Server：如何在Razor页面展示后台创建的C# DataTable

一、先解决DuplicateNameException错误 #

这个异常是因为你的DataTable中存在重复名称的列，解决步骤：

• 检查创建DataTable列的代码，确保每个列名唯一，比如添加列时明确指定唯一名称：

  Programs_WMI_total.Columns.Add("ProgramName", typeof(string));
  Programs_WMI_total.Columns.Add("Publisher", typeof(string));
  // 避免重复添加同名列，也可以先判断列是否存在再添加
  if (!Programs_WMI_total.Columns.Contains("InstallDate"))
  {
      Programs_WMI_total.Columns.Add("InstallDate", typeof(string));
  }
  

• 如果是从外部数据源（比如WMI查询结果）填充时引入了重复列，需要先预处理数据源，确保列名不重复。

二、正确展示DataTable的方法 #

Blazor没有内置的直接绑定DataTable到HTML表格的组件，需要遍历DataTable的列和行来生成表格，但无需手动拆分成多个数组，用循环即可高效处理：

1. 后台正确填充DataTable #

public DataTable Programs_WMI_total { get; set; }

protected override void OnInitialized()
{
    // 初始化DataTable并添加唯一列
    Programs_WMI_total = new DataTable();
    Programs_WMI_total.Columns.Add("Program name", typeof(string));
    Programs_WMI_total.Columns.Add("Publisher", typeof(string));
    Programs_WMI_total.Columns.Add("Install. date", typeof(string));
    Programs_WMI_total.Columns.Add("Install. path", typeof(string));

    // 替换为你的实际数据填充逻辑（比如从WMI查询结果读取）
    foreach (DataRow row in WMI_Programs_table.Rows)
    {
        Programs_WMI_total.Rows.Add(
            row[0].ToString(),
            row[1].ToString(),
            row[2].ToString(),
            row[3].ToString()
        );
    }
}

2. Razor页面生成HTML表格 #

@if (Programs_WMI_total != null && Programs_WMI_total.Rows.Count > 0)
{
    <table>
        <!-- 生成表头 -->
        <tr>
            @foreach (DataColumn column in Programs_WMI_total.Columns)
            {
                <th class="table_header">@column.ColumnName</th>
            }
        </tr>
        <!-- 生成表体数据 -->
        @foreach (DataRow row in Programs_WMI_total.Rows)
        {
            <tr>
                @foreach (var cellValue in row.ItemArray)
                {
                    <td>@cellValue.ToString()</td>
                }
            </tr>
        }
    </table>
}
else
{
    <p>暂无程序数据</p>
}

三、你现有代码的问题分析 #

1. 后台代码中Programs_WMI_total.GetLength(1)是错误用法：DataTable没有GetLength方法（这是数组的方法），遍历行应该用Programs_WMI_total.Rows.Count，遍历列用Programs_WMI_total.Columns.Count。
2. 手动将DataTable拆分成多个数组（Programs_WMI_name_sorted等）不仅冗余，还容易出现索引错误（比如循环从m=1开始，漏掉了第一行数据）。
3. Razor页面中判断Programs_WMI_name[0] != null存在风险：如果数组未初始化或长度不足，会引发索引越界异常，直接判断DataTable的行数更可靠。

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