Blazor中如何根据数据库返回的整数值设置单选按钮组

要解决编辑时单选按钮自动选中的问题，核心是给每个单选按钮绑定选中状态，让它根据_gameFact.PlayValue的值自动判断是否选中。下面给两种实现方式：

方式一：直接修改现有代码，添加选中判断 #

给每个单选按钮加上checked属性，判断当前_gameFact.PlayValue是否等于按钮对应的值，同时优化@onchange的写法，避免硬编码赋值：

<div class="row">
    <div class="col">
        <input name="PlayValue" type="radio" value="0" 
               checked="@(_gameFact.PlayValue == 0)" 
               @onchange="(e) => _gameFact.PlayValue = int.Parse(e.Value.ToString())" />
    </div>
    <div class="col">
        <input name="PlayValue" type="radio" value="1" 
               checked="@(_gameFact.PlayValue == 1)" 
               @onchange="(e) => _gameFact.PlayValue = int.Parse(e.Value.ToString())" />
    </div>
    <div class="col">
        <input name="PlayValue" type="radio" value="2" 
               checked="@(_gameFact.PlayValue == 2)" 
               @onchange="(e) => _gameFact.PlayValue = int.Parse(e.Value.ToString())" />
    </div>
    <div class="col">
        <input name="PlayValue" type="radio" value="3" 
               checked="@(_gameFact.PlayValue == 3)" 
               @onchange="(e) => _gameFact.PlayValue = int.Parse(e.Value.ToString())" />
    </div>
</div>

当从数据库加载数据给_gameFact.PlayValue赋值后，对应的单选按钮会自动被选中。

方式二：用循环简化代码（推荐） #

如果选项固定，用循环生成单选按钮，避免重复代码，后期维护更方便：

首先在组件的代码块里定义选项列表：

// 组件代码段
private readonly List<int> _playValueOptions = new() { 0, 1, 2, 3 };
private GameFact _gameFact = new(); // 假设你的模型类是GameFact

然后在页面中循环渲染：

<div class="row">
    @foreach (var value in _playValueOptions)
    {
        <div class="col">
            <input name="PlayValue" type="radio" value="@value" 
                   checked="@(_gameFact.PlayValue == value)" 
                   @onchange="(e) => _gameFact.PlayValue = int.Parse(e.Value.ToString())" />
        </div>
    }
</div>

原理说明 #

• checked="@(_gameFact.PlayValue == value)"：这行是核心，实时比较当前模型值和单选按钮的value，匹配时自动选中该按钮。
• 优化后的@onchange通过e.Value获取按钮的value值，不用每个按钮都写硬编码的赋值逻辑，更简洁。

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