为什么我的 Blazor 单选按钮必须单击两次才能选择，而单击复选框时则必须取消选择？

Question

我有一个 Blazor 表单，其中包含一些单选按钮（在 InputRadioGroup 内）和一些复选框。我有两个问题：

1. 我必须单击单选按钮两次才能选择它。
2. 选择后，如果我单击复选框，收音机将被取消选中。

我通过添加此剃刀组件，使用 Blazer Server .net 6.0 模板在新项目中重现了该问题：

<EditForm Model="FormModel">
    <InputRadioGroup @bind-Value="FormModel.SelectedRadio">
        <InputRadio Value="1" /> 1
        <InputRadio Value="2" /> 2
    </InputRadioGroup>
    <InputCheckbox @bind-Value="FormModel.Checkbox"/>
</EditForm>

@code {
    private FormData FormModel { get; set; } = new FormData();

    public class FormData
    {
        public string SelectedRadio { get; set; }
        public bool Checkbox { get; set; }
    }
}

Answer 1

请参阅代码的修改版本。我已经改成FormModel.SelectedRadioint了 Inputxxxx 是类型化控件，而不是 html 基本控件使用的标准文本。

@page "/"
<EditForm Model="FormModel">
    <InputRadioGroup @bind-Value="FormModel.SelectedRadio">
        <InputRadio Value=1 /> 1
        <InputRadio Value=2 /> 2
    </InputRadioGroup>
    <InputCheckbox @bind-Value="FormModel.Checkbox"/>
</EditForm>

Selected: @FormModel.SelectedRadio
@code {
    private FormData FormModel { get; set; } = new FormData();

    public class FormData
    {
        public int SelectedRadio { get; set; }
        public bool Checkbox { get; set; }
    }
}