Blazor中如何获取元素ID并传递给点击事件

你遇到的核心问题是循环变量捕获导致的引用问题，直接在lambda里用循环变量i会导致所有点击都拿到循环结束时的最终值。下面是两种可行的解决方法：

方法一：使用局部变量保存当前循环值 #

在for循环内部声明一个局部变量，保存当前的i值，避免lambda捕获循环变量的引用：

for (var i = 0; i < 7; i++)
{
    var currentId = i; // 保存当前迭代的ID到局部变量
    <td id=@currentId @onclick="() => SelectEntry(currentId)">@currentId</td>
}

对应的SelectEntry方法需要接收ID参数：

private void SelectEntry(int entryId)
{
    // 在这里使用entryId识别被点击的条目
    // 示例逻辑：输出点击的ID
    Console.WriteLine($"选中的条目ID: {entryId}");
}

方法二：改用foreach循环遍历范围 #

用Enumerable.Range生成迭代范围，foreach循环的迭代变量每次都是独立实例，不会出现引用捕获问题：

@foreach (var i in Enumerable.Range(0, 7))
{
    <td id=@i @onclick="() => SelectEntry(i)">@i</td>
}

同样需要对应带参数的SelectEntry方法，逻辑和方法一一致。

为什么原代码会失效？ #

for循环的变量i是在循环外部声明的，lambda表达式() => SelectEntry()捕获的是这个变量的引用，而不是每次循环的具体值。当循环结束后，i的值已经变为6，所以所有td的点击事件触发时，都会使用这个最终值。

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