ValidateForm 是 Bootstrap Blazor 中用于表单验证的组件。它基于 Blazor 的表单验证机制，结合 Bootstrap 的样式，提供了强大的表单验证功能。以下是 ValidateForm 的常见使用方法： 1. 基本用法 ValidateForm 包裹表单内容，并通过 EditContext 实现数据验证。 示例代码 @page "/validate-form-demo" @using BootstrapBlazor.Components @using System.ComponentModel.DataAnnotations <ValidateForm Model="@person" OnValidSubmit="OnValidSubmit"> <div class="form-group"> <label>Name</ …
现象： 如图在选择销售人员时，第一次选择无效，第二次选择才能成功。使用select组件 原因： SailerID属性没有初始化，默认值为NULL导致的这个现象。 解决方法： 在构造函数里讲初始值设置为空。 …
Blazor 组件生命周期 Blazor 组件具有定义完善的生命周期，该生命周期从首次创建时开始，在销毁时结束。 组件生命周期由一组事件控制，这些事件响应特定触发器。 例如组件被初始化、用户与组件交互或组件所在的页面被关闭。 本单元介绍 Blazor 组件生命周期中发生的事件。 你将了解如何处理这些事件以优化完成的工作，并提高 Blazor 页面的响应能力。 Blazor 组件生命周期 Blazor 组件表示 Blazor 应用中的视图，它们定义布局和 UI 逻辑。 应用运行时，这些组件会生成 HTML 标记。 用户交互事件可以触发自定义代码，并且可以更新组件以重新呈现显示。 页面关闭时，Blazor 会删除组件，并清理所有资源。 当用户返回到页面时，将创建新实例。 下图说明了在组件生命周期内发生的事件，以及可用于处理这些事件的方法。 Blazor 提供每种方法的同步和异步版本， …
用户使用表单输入数据。 在经典 Web 应用中，可以使用 <form> 元素创建表单，并允许用户使用 <input> 元素提供数据。 可在用户提交表单时验证输入。 如果验证成功，则可以执行相应的操作，例如使用提供的信息向数据库添加新条目或更新记录。 <form> 和 <input> 元素提供的功能非常简单，但相对基础。 Blazor 扩展了表单功能及其 <EditForm> 组件。 此外，Blazor 提供了一系列专用输入元素，可用于设置用户所输入数据的格式并进行验证。 在本单元中，你将了解如何使用 <EditForm> 元素和输入元素来生成功能性表单。 你还将了解如何使用表单进行数据绑定。 什么是 EditForm？ EditForm 是一个 Blazor 组件，它在 Blazor 页面上履行 HTML 表单这一角色。 EditForm 和 HTML 表单之间的主要区别是： 数据绑定：可 …
大多数 HTML 元素都会公开在发生重要事件（例如页面加载完成、用户单击某个按钮或 HTML 元素的内容已更改）时触发的事件。 应用可以通过多种方式处理事件： 应用可以忽略此事件。 应用可以运行用 JavaScript 编写的事件处理程序来处理事件。 应用可以运行用 C# 编写的 Blazor 事件处理程序来处理事件。 本单元将详细介绍第三个选项：如何用 C# 创建用于处理事件的 Blazor 事件处理程序。 使用 Blazor 和 C# 处理事件 Blazor 应用的 HTML 标记中的每个元素都支持许多事件。 这些事件中的大多数对应于常规 Web 应用程序中可用的 DOM 事件，但你也可以创建通过编写代码触发的用户定义事件。 若要使用 Blazor 捕获事件，请编写处理该事件的 C# 方法，然后使用 Blazor 指令将事件绑定到该方法。 对于 DOM 事件，Blazor 指令与等效 …
编写 Blazor 布局 Blazor 布局是特定类型的组件，因此编写 Blazor 布局与编写其他组件以在应用中呈现 UI 类似。 例如，以相同的方式使用 @code 块和很多指令。 布局在扩展名为 .razor 的文件中定义。 文件通常存储在应用的“Shared”文件夹中，但你可以选择将其存储在使用它的组件可访问的任何位置。 布局组件有两个独特的要求： 必须继承 LayoutComponentBase 类。 必须在要呈现发起引用的组件内容的位置包含 @Body 指令 @inherits LayoutComponentBase <header> <h1>Blazing Pizza</h1> </header> <nav> <a href="Pizzas">Browse …
使用路由模板 用户请求你的 Web 应用中的页面时，可以使用 URI 中的信息指定要查看的内容。 例如： http://www.contoso.com/pizzas/margherita?extratopping=pineapple 在协议和网站地址之后，此 URI 指示用户想要了解玛格丽特披萨。 此外，问号后的查询字符串显示他们有兴趣额外添加一份菠萝配料。 在 Blazor 中，使用路由来确保将每个请求发送到最适合的组件，并且该组件具有显示用户所需内容的全部信息。 在本例中，你可能希望将请求发送到 Pizzas 组件，并使该组件显示玛格丽特披萨，并显示有关添加菠萝配料的信息。 Blazor 使用名为 Router 组件的专用组件路由请求。 它在 App.razor 中配置如下： <Router AppAssembly="@typeof(Program).Assembly"& …
呈现 C# 表达式值 若要在 Razor 中呈现 C# 表达式的值，可以使用前导 @ 字符。 例如，Counter 组件可以呈现其 currentCount 字段的值，如下所示： <p role="status">Current count: @currentCount</p> Razor 通常可以判断出 C# 表达式何时结束，以及何时转换回编写 HTML。 但是，也可以使用 parens 来明确表达式的开始和结束。 <p role="status">Current count: @(currentCount)</p> 添加控制流 可以使用普通的 C# 语句将控制流添加到组件呈现逻辑。 例如，可以使用 C# if 语句有条件地呈现某些内容，如下所示： @if (currentCount > 3) { <p> …
在Blazor里提供Webapi服务的方法 1、注册Controller服务 builder.Services.AddControllers(); 2、监听控制器 //app.UseHttpsRedirection(); 如果使用https app.MapControllers(); 3、注册Swagger builder.Services.AddSwaggerGen(c => { c.SwaggerDoc("v1", new OpenApiInfo { Title = "Your App Title", Version = "v1" }); }); 4、启动Swagger服务 app.UseSwagger(); app.UseSwaggerUI(c => { c.SwaggerEndpoint("/swagger/v1/swagger.json", " …
NotificationService配合NotificationMessage弹出tip框 @inject NotificationService NotificationService Info …