奇怪的复选框@onchange 处理行为

Question

在我的一个（服务器端）blazor 页面中，我有以下构造：

一个 table 每行有一个复选框（除其他外）
复选框有一个 onchange 处理程序，在一个星座中，它将从“选择table元素”集合中删除一个未选中的元素：

@foreach (ViewModels.Element element in SelectableElements)
{
    <tr>
        <td>
            <input type="checkbox" checked="@IsChecked(element)" @onchange="(e) => OnCheckedChange(element, e)">
        </td>       
        <td>
            @element.Name
        </td>
    </tr>
}

// ...

protected void OnCheckedChange(Element element, ChangeEventArgs e)
{
    if (!(bool)e.Value)
    {
        SelectableElements.Remove(element);
    }    
}

当一个选中的元素被取消选中时，它将从 table 中消失。但是，在重新渲染后，删除行下方的行将取消选中其复选框，这不是我想要的，我不确定为什么会这样？我可以在调试器中看到 IsChecked(...) returns 对于未检查的元素为真。

Answer 1

我最终让它工作的方式是这样的：

<input type="checkbox" checked="@IsChecked(element)" @onclick:preventDefault @onclick="(e) => OnCheckedChange(element)">

这样我就可以自己处理点击，而不用默认行为设置复选标记。

奇怪的复选框@onchange 处理行为

Odd checkbox @onchange handling behaviour

c#

blazor-server-side