Blazor中@bind-value绑定模型属性触发CS0120错误的原因

错误原因 #

你直接通过类名ToDoItem访问属性ToDo，但C#要求非静态成员必须通过类的实例对象访问，这就是触发CS0120错误的核心原因。

修复方案（含必填验证实现） #

以下是修改后的完整Razor页面代码，同时实现了必填字段的空值提示：

<EditForm Model="@todoItem" OnValidSubmit="Save">
    <DataAnnotationsValidator />
    
    <input id="txtToDo" @bind-value="@todoItem.ToDo" placeholder="What You Need To Do" />
    <!-- 显示必填字段的错误提示 -->
    <ValidationMessage For="@(() => todoItem.ToDo)" />

    <input type="datetime-local" @bind="@todoItem.DueDate" placeholder="Due Date" />
    
    <button type="submit">Save</button>
</EditForm>

@code {
    // 创建ToDoItem类的实例，避免与类名重名，采用规范的变量命名
    private ToDoItem todoItem = new ToDoItem();

    private void Save()
    {
        // 此处编写保存逻辑，仅当表单验证通过时才会执行
    }
}

关键修改说明 #

1. 实例化模型：在@code块中声明todoItem实例，绑定输入控件时使用该实例的属性，而非类名直接访问。
2. 启用表单验证：
   • EditForm包裹所有表单元素，绑定模型并指定验证通过后的提交方法
   • DataAnnotationsValidator启用基于数据注解的验证（对应模型中的[Required]特性）
   • ValidationMessage用于显示对应字段的错误提示
3. 按钮类型调整：将按钮改为type="submit"，点击时自动触发表单验证，验证不通过则不会执行Save方法。

自定义错误提示（可选） #

如果需要替换默认提示文本，可修改模型的[Required]特性：

[Required(ErrorMessage = "请输入待办事项内容")]
public string? ToDo { get; set; }

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