学习ASP.NET Core Blazor编程系列八——数据校验( 二 ) _生活百科

我们将在表单中使用此实体，校验特性应用在实体类的属性上，并且将前端强制执行。Required 特性表示属性必须具有一个值。但是，用户可以随时输入空格对可以为 null 的类型进行校验约束。从本质上来说，对于不能为 null 的值类型（如 decimal、int、float 和 DateTime），可以不添加 Required 特性。
RegularExpression 特性限制用户可以输入的字符。在上述代码中，Type字母（禁用空格、数字和特殊字符）。
Range 特性将值限制在指定范围内。
【学习ASP.NET Core Blazor编程系列八——数据校验】StringLength 特性设置字符串的最大长度，且可视情况设置最小长度。
第八，在Visual Studio 2022的菜单栏上，找到“调试à开始调试”或是按F5键，Visual Studio 2022会生成BlazorAppDemo应用程序，并在浏览器中打开Home页面，我们使用鼠标点击左边的菜单栏上的“添加图书”菜单项，然后使用鼠标左键点击“保存”按钮，会出现一个错误，如下图。

文章插图
从上图中看出，校验好像没有起作用就直接保存到数据库了，这是因为我们没有在EditForm中没有添加DataAnnotationsValidator组件。如果要显示校验不通过生成的提示消息，我们应该加一个ValidationSummary组件，这个组件用于显示表单中所有控件的有校验规则的提示消息集合。我们来修改一下组件的代码，具体代码如下。
<h3>AddBook</h3><EditForm Model=@addBook OnSubmit="Save"> <DataAnnotationsValidator /> <ValidationSummary /> <div>@Message</div> <p> 图书名称： <InputText @bind-Value=https://www.huyubaike.com/biancheng/addBook.Name>

作者：

出版日期：

价格：

类型：

总页数：

库存数量：

已租数量：

第九，在Visual Studio 2022的菜单栏上，找到“调试-->开始调试”或是按F5键，Visual Studio 2022会生成BlazorAppDemo应用程序，并在浏览器中打开Home页面，我们使用鼠标点击左边的菜单栏上的“添加图书”菜单项，然后使用鼠标左键点击“保存”按钮，由于我们没有输入正确的数据，校验组件将会提示我们要输入的数据。如下图。

文章插图
Blazor的校验是在以下两个时间点上执行：

当用户按 Tab 键离开某个字段时，将执行字段验证。字段验证可确保用户及早了解验证问题。
当用户提交表单时，将执行模型验证。模型验证可确保不会存储无效数据。

如上图，表单验证失败，提示消息都显示在ValidationSummary，而没有显示在相应输入框的旁边。
如果想要将校验提示信息显示在输入框的旁边，需要在代码中添加 ValidationMessage 组件。如果你不想要Blazor提供的默认信息，你可以在实体类的每个属性的特性中找到一个ErrorMessage属性，这个属性就是用于自己定义一些校验提示消息，校验的提示消息尽可能的对用户有所帮助。代码如下所示。