Blazor ValidationMessage 支持通过 DataAnnotations 特性、IValidatableObject 接口或手动操作 EditContext.ValidationMessageStore 三种方式实现自定义错误提示,同时可通过 CSS 或手动渲染控制样式与结构。

Blazor 的 ValidationMessage 组件默认只显示模型验证失败时的错误信息,但不支持直接传入自定义文本。要实现自定义错误提示(比如统一文案、带图标、多语言或动态内容),关键不是改组件本身,而是控制它“显示什么”——这需要从验证上下文和字段绑定入手。
用 DataAnnotations 自定义 ErrorMessage
最简单的方式是在模型属性上使用 [Required(ErrorMessage = "此项必填")] 等特性。Blazor 的 ValidationMessage 会自动读取该值:
[Required(ErrorMessage = "用户名不能为空")]
public string? Username { get; set; }
注意:必须确保模型属性有 setter(即使为 private),否则验证器无法设置错误;且需在页面中正确绑定 EditContext(如用 EditForm)。
用 IValidatableObject 或自定义验证器动态生成消息
当错误信息需根据其他字段、业务逻辑或用户输入实时变化时,可实现 IValidatableObject 接口:
- 在模型中重写
Validate方法,返回ValidationResult,其中MemberNames指定关联字段 -
ValidationMessage仍通过For绑定该字段,错误信息即来自你返回的ValidationResult.ErrorMessage
例如:密码和确认密码不一致时,向 ConfirmPassword 字段添加自定义错误:“两次输入的密码不一致”。ValidationMessage For="@(() => model.ConfirmPassword)" 就会显示它。
绕过内置验证,手动注入错误(高级场景)
如果需要完全脱离 DataAnnotations(比如调用后端 API 校验后显示错误),可直接操作 EditContext 的 ValidationMessageStore:
- 获取
EditContext实例(如通过@ref或CascadingParameter) - 调用
validationMessageStore.Add(new FieldIdentifier(model, nameof(model.Email)), "邮箱已被注册") - 再调用
editContext.NotifyValidationStateChanged()触发重绘
此时 就会显示你手动添加的那条消息,且与表单生命周期同步。
样式与结构自定义(非文字内容,但常被一起需要)
ValidationMessage 渲染为一个









