Blazor双向数据绑定问题：Checkbox未更新绑定属性

你的问题出在复选框的绑定代码上——同时使用了@bind-value和checked属性，这两者会互相冲突，破坏了Blazor的双向绑定逻辑。

问题分析 #

Blazor的@bind-value指令已经自动处理了复选框的状态同步（包括checked属性的设置和onchange事件的绑定），你手动添加的checked="@(Room.IsActive?"checked":null)"会覆盖@bind-value的自动处理，导致绑定失效。

解决方案 #

移除复选框上手动设置的checked属性，仅保留@bind-value="Room.IsActive"即可。此外，复选框不需要指定@bind-value:event="oninput"，因为Blazor对复选框的双向绑定默认使用onchange事件，完全适配需求。

修改后的完整组件代码：

<h2 class="bg-light border p-2">
    First Room
</h2>
Room: @Room.RoomName
<br />
Price: @Room.Price
<br />

<input type="number" @bind-value="Room.Price" @bind-value:event="oninput" />
<br />
<input type="checkbox" @bind-value="Room.IsActive" /> &nbsp; Is Active
<br />
<span>This room is @(Room.IsActive ? "Active" : "Inactive")</span>
<br />


Room: @Room.RoomName
<br />
Price: @Room.Price
<br />


@code{
    BlazorRoom Room = new BlazorRoom()
    {
        Id = 1,
        RoomName = "Villa Suite",
        IsActive = true,
        Price = 599
    };
}

额外说明 #

如果后续你需要在代码中手动更新Room.IsActive的值（比如通过按钮点击），由于Room是组件内的本地变量，Blazor会自动检测状态变化并刷新UI。如果遇到复杂场景下UI未刷新的情况，可以手动调用StateHasChanged()方法通知组件更新。

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