Blazor组件双向绑定失效：提交表单触发必填验证报错

问题根源 #

1. 模型绑定不匹配：你在Subject属性上使用了[SupplyParameterFromForm]，但InputText默认生成的name属性是SubName，而非Subject.SubName，导致表单提交时无法将输入值正确绑定到Subject.SubName，最终SubName为null，触发[Required]验证提示。
2. 组件状态重置：表单提交后，[SupplyParameterFromForm]尝试绑定Subject对象，绑定失败会导致Subject被重置为初始空对象或null，进而清空输入框内容。

解决方案 #

方案一：移除[SupplyParameterFromForm]（推荐） #

Blazor增强表单（Enhance="true"）已内置状态保留机制，无需依赖[SupplyParameterFromForm]传递表单数据。修改组件代码如下：

在@code块中移除Subject属性上的[SupplyParameterFromForm]特性：

// 移除该行
// [SupplyParameterFromForm]
public SubjectName? Subject { get; set; }

保留OnInitializedAsync中的初始化逻辑不变，增强表单会自动保留输入状态，提交时通过OnValidSubmit回调传递完整Subject对象，验证逻辑也会正常工作。

方案二：修正表单字段name属性（如需保留[SupplyParameterFromForm]） #

若必须使用[SupplyParameterFromForm]，需手动指定InputText的name属性，确保与模型绑定路径一致：

<InputText id="subname" @bind-Value="Subject.SubName" name="Subject.SubName" class="form-control shadow-none" />

同时确认编辑模式下的隐藏字段name属性正确：

<input type="hidden" name="Subject.Id" value="@Subject.Id"/>

这样表单提交时，数据会正确映射到Subject对象的对应属性，避免验证错误和输入内容清空的问题。

额外检查点 #

• 确认OnValidSubjectNameSubmit回调正确处理Subject对象，未在回调中意外重置其状态。
• 确保编辑模式下ISubjectNameRepo.GetByIdAsync(Id)能返回有效Subject对象，避免Subject为null导致表单无法渲染。

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