Blazor
flyingdream123
这个作者很懒,什么都没留下…
展开
-
Blazor错误处理
Blozor错误组件友好显示方式原创 2022-09-02 22:12:07 · 571 阅读 · 0 评论 -
Blazor异常消息显示
1. 打开/Share/MainLayout.razor文件用 ErrorBoundary标签包果@Body内容。 <ErrorBoundary @ref="_errorBoundary"> <ReuseTabs Class="top-row px-4" TabPaneClass="content px-4" /> <BlazoredToasts Position="To原创 2022-04-26 14:51:31 · 958 阅读 · 0 评论 -
AntBlazor UI
设置控件输入焦点:<button @onclick="() => textInput.FocusAsync()">Set focus</button><input @ref="textInput"/>@code { ElementReference textInput;}表格绑定复合对象属性: <Column TData="string" DataIndex="Plate.PlateName" Title="板块" Sorta..原创 2021-11-28 10:12:21 · 225 阅读 · 0 评论 -
在 IIS 上部署 ASP.NET Core Web Api
将 ASP.NET Core 应用发布到 IIS本教程介绍如何在 IIS 服务器上托管 ASP.NET Core 应用。在 Windows Server 上安装.NET Core Hosting Bundle。 在 IIS 管理器中创建 IIS 站点。 部署 ASP.NET Core 应用。1.安装 .NET Core 托管捆绑包在 IIS 服务器上安装 .NET Core 托管捆绑包。 捆绑包可安装 .NET Core 运行时、.NET Core 库和ASP.NET Core 模块。 .原创 2021-08-31 15:40:41 · 813 阅读 · 0 评论 -
.Net5.0 Blazor 高频代码
对象序列化成Json:string jsonString = JsonSerializer.Serialize(weatherForecast);在服务端获取用户请求的Url地址:@using Microsoft.AspNetCore.Http.Extensions@Context.Request.GetEncodedUrl() //Use for any purpose (encoded for safe automation)@Context.Request.GetDisplayUr原创 2021-08-24 16:02:39 · 173 阅读 · 0 评论 -
Blazor Json Web Token 身份验证与授权
Blazor 身份验证与授权身份验证Blazor Server应用和 Blazor WebAssembly 应用的安全方案有所不同。Blazor WebAssemblyBlazor WebAssembly 应用在客户端上运行。 由于用户可绕过客户端检查,因为用户可修改所有客户端代码, 因此授权仅用于确定要显示的 UI 选项,所有客户端应用程序技术都是如此。Blazor ServerBlazor Server应用通过使用 SignalR 创建的实时连接运行。 建立连接后,将处理基于 Sig转载 2021-07-28 11:59:25 · 4906 阅读 · 0 评论 -
Blazor 部署
《进击吧!Blazor!》是本人与张善友老师合作的Blazor零基础入门教程视频,此教程能让一个从未接触过Blazor的程序员掌握开发Blazor应用的能力。视频地址:https://space.bilibili.com/483888821/channel/detail?cid=151273Blazor WebAssembly 是单页应用 (SPA) 框架,用于使用 .NET 生成交互式客户端 Web 应用,采用 C# 代替 JavaScript 来编写前端代码本系列文章基于《进击吧!Blazor!》转载 2021-07-28 11:05:47 · 3461 阅读 · 0 评论 -
组件加载过渡动画效果 BlazorAnimate
1.引用依赖包:BlazorAnimate2.在 index.html文件中</body>节前引用脚本 <script src="_content/BlazorAnimate/blazorAnimateInterop.js"></script>3.加载组件动画放大过渡效果例子@page "/animation"@using BlazorAnimate<h3>Animation in Blazor</h3><.原创 2020-10-07 10:06:11 · 990 阅读 · 0 评论 -
使用Serilog记录日志
默认日志:Console.WriteLine("日志内容...");Serilog日志:Log.Error("OMG its on fire!");例子显示效果:安装依赖包:Serilog和Serilog.Sinks.BrowserConsole注意由于Serilog.Sinks.BrowserConsole现在还没有正式版本,所以必须在“程序包管理控件台”用命令安装,命令如下:dotnet add BlazorApp3 package Serilog.Sink..原创 2020-10-07 07:10:03 · 895 阅读 · 0 评论 -
构建Markdown Editor 编辑器
test原创 2020-10-06 14:55:41 · 264 阅读 · 0 评论 -
调用JavaScript函数
@page "/jsinterop"@inject IJSRuntime JSRuntime;<h3>调用JavaScript</h3><button type="button" class="btn btn-primary" @onclick="CallJs"> Call a JS function</button>@if(!string.IsNullOrWhiteSpace(jsText)){ <p><.原创 2020-10-06 11:23:07 · 175 阅读 · 1 评论 -
流验证表单Blazored.FluentValidation
@page "/editforms"@using Blazored.FluentValidation<h3>Edit Forms and Validation</h3><EditForm Model="BlogPostModel" OnValidSubmit="HandleValidSubmit"> @*将数据注释验证信息注入到表单控件*@ @*<DataAnnotationsValidator/>*@ <Fluent.原创 2020-10-06 09:45:16 · 218 阅读 · 0 评论 -
表单和数据注释验证
@page "/editforms"<h3>Edit Forms and Validation</h3><EditForm Model="BlogPostModel" OnValidSubmit="HandleValidSubmit"> @*将数据注释验证信息注入到表单控件*@ <DataAnnotationsValidator/> <div class="row mt-4"> <label .原创 2020-10-06 08:36:33 · 232 阅读 · 0 评论 -
导航
@page "/Navigate"@inject NavigationManager navigationManager<h3>Navigate</h3><button class="btn btn-primary" @onclick="NavigateToHandleCallbacks">Navigate to the HandleCallbacks</button>@code { private void NavigateToHand.原创 2020-10-05 08:06:59 · 138 阅读 · 0 评论 -
事件回调HandleCallbacks
@*带事件的组件*@<div> <span>@Title</span> <span>@Description</span> <button class="btn btn-primary" @onclick="@(()=>OnClick.InvokeAsync(Title))"> Click me </button></div>@code { .原创 2020-10-04 20:05:48 · 355 阅读 · 0 评论 -
限制参数类型为整数的组件
@page "/IntParameter"@page "/IntParameter/{id:int}"<h3>IntParameter ID:@Id</h3>@code { [Parameter] public int Id { get; set; }}原创 2020-10-04 19:29:39 · 218 阅读 · 0 评论 -
带参数的组件
@page "/ParameterComponent"@page "/ParameterComponent/{text}"<h3>Blazor is @Text</h3>@code { [Parameter] public string Text { get; set; } protected override void OnInitialized() { Text = Text ?? "很棒"; }}..原创 2020-10-04 19:16:29 · 123 阅读 · 0 评论 -
在文本框中输入值,实时更新属性值
@page "/mybinding"<h1>@Title</h1><p> <span>失去焦点时更新属性值 Title changes when the input box loses focus (onChange).</span> <input type="text" @bind="Title"/></p><p> <span>实时更新属性值 Title ch.原创 2020-10-04 18:55:26 · 349 阅读 · 0 评论 -
Blazor免费资源网站
https://www.matblazor.com/原创 2020-05-02 17:38:28 · 1646 阅读 · 0 评论 -
Blazor 简介
Blazor 是一个用于使用 .NET 生成交互式客户端 Web UI 的框架:使用 C# 代替 JavaScript 来创建丰富的交互式 UI。 共享使用 .NET 编写的服务器端和客户端应用逻辑。 将 UI 呈现为 HTML 和 CSS,以支持众多浏览器,其中包括移动浏览器。使用 .NET 进行客户端 Web 开发可提供以下优势:使用 C# 代替 JavaScript 来编写代码...翻译 2019-05-29 09:47:40 · 9134 阅读 · 0 评论 -
razor组件设置属性(传递参数),在被调用组件中呈显组件调用内容
Blazor 应用基于组件。Blazor 中的组件是指 UI 元素,例如,页面、对话框或数据输入窗体。组件处理用户事件,并定义灵活的 UI 呈现逻辑。组件可以嵌套和重用。组件是内置于 .NET 程序集的 .NET 类,可以作为NuGet 包进行共享和分发。组件类通常以 Razor 标记页(文件扩展名为 .razor)的形式编写。Razor Pages 和 MVC 也使用 Raz...翻译 2019-05-29 14:42:41 · 3521 阅读 · 0 评论 -
Razor组件——两个组件之间使用委托传递方法,实现子组件事件更新父组件状态
@page "/ParentComponent"<h3>Parent Component</h3><p>String in Parent:@parentString</p><button @onclick="@PassToChild">Pass String To</button><ChildCompon...原创 2019-08-08 16:41:44 · 500 阅读 · 0 评论 -
Razor组件——的事件
@page "/ParentEventComponent"<h3>Parent Event Component</h3><p>Logging Event triggered from Child:@logString</p><ChildEventComponent Trigger="@TriggerFromChild"><...原创 2019-08-08 17:14:13 · 1087 阅读 · 0 评论 -
Razor组件——调用组件时将内容传递给子组件,渲染片段(动态内容)
我们可以使用属性在组件标记元素中传递内容,而不是使用属性将任何内容从Parent传递到子组件RenderFragment。#方法1:以下ChildContent是我们需要在Child组件中使用RenderFragment属性来从Parent获取内容的命名约定,//ParentComponent.razor<h3> Parent Component</h3>...翻译 2019-08-08 18:18:44 · 659 阅读 · 0 评论 -
Razor组件——依赖注入
依赖注入通过使用@inject指令,在每个组件级别的blazor中实现依赖注入(DI)。我们可以在Startup.cs>ConfigureServices函数中以与MVC应用程序相同的方式注入依赖项,如下所示,并且可以在blazor组件中使用。这些服务的生命周期是类似的MVC应用程序,比如Singleton,Transient和Scoped我们在这里使用现有的ASP.Net的生态系...翻译 2019-08-08 18:31:03 · 2212 阅读 · 0 评论 -
Razor组件——路由
路由客户端路由可以通过使用@page指令装饰组件来在blazor中完成,如前面的示例中所示,//ParentComponent.razor@page "/parent-component"<h3> Parent Component</h3><p>String in Parent: @parentString</p><butt...转载 2019-08-09 09:25:56 · 704 阅读 · 0 评论 -
创建和使用Razor组件
组件参数组件可以具有组件参数,这些参数是使用具有该属性的组件类上的private非公共属性定义的[Parameter]。使用属性为标记中的组件指定参数。ParentComponent父组件:@page "/ParentComponent"<h1>parent-child example</h1><ChildComponent Title="Pane...翻译 2019-05-31 11:49:51 · 2816 阅读 · 0 评论