C# Blazor：删除动态创建的组件总是从列表中删除最后一项

我正在用Blazor WebAssembly实现一个简单的固定板。当使用X按钮移除任何卡时，它始终是列表中被移除的最后一个元素

@foreach (var item in _cards)
{
    <div class="card-title">
        <input type="text" id="@item.TitleElementId" value="@item.Title" />
        <button class="btn-remove" @onclick="() => RemoveCard(item)">X</button>
    </div>
}
<button class="btn-add" @onclick="AddNewCard">+</button>

@code {
    private List<Card> _cards = new List<Card>();

    private void AddNewCard()
    {
        _cards.Add(new Card());
    }

    private void RemoveCard(Card card)
    {
        _cards.Remove(card);
        // Also tried _cards.RemoveAll(i => i.TitleElementId == card.TitleElementId);
    }
}

@foreach（卡片中的变量项）
{
X
}
+
@代码{
私人列表_cards=新列表（）；
私有void AddNewCard（）
{
_卡片。添加（新卡片（））；
}
私人作废移除卡（卡片）
{
_卡片。移除（卡片）；
//还尝试了_cards.RemoveAll（i=>i.TitleElementId==card.TitleElementId）；
}
}

我注意到，只有在修改卡中某些输入的值后，才会发生这种情况

结果证明这是值绑定的问题。我需要使用Blazor的

@bind-“”

，而不是默认的html

value=“”

。不幸的是，我不知道为什么会这样

所以不是

<input type="text" value="item.Title"/>

我改成

<input type="text" @bind="item.Title"/>

---

一切都按预期进行

我也有这个问题。似乎每当我试图从列表中删除某些内容时。列表已正确更新，但绑定已从末尾删除。