MASA Blazor入门这一篇就够了

Python微信订餐小程序课程视频

https://edu.csdn.net/course/detail/36074

Python实战量化交易理财系统

https://edu.csdn.net/course/detail/35475

1.什么是Blazor? 有什么优势？

ASP.NET Core Blazor 简介

Blazor 是一个使用 Blazor 生成交互式客户端 Web UI 的框架：

1. 使用 C# 代替 JavaScript 来创建信息丰富的交互式 UI。
2. 共享使用 .NET 编写的服务器端和客户端应用逻辑。
3. 将 UI 呈现为 HTML 和 CSS，以支持众多浏览器，其中包括移动浏览器。
4. 与新式托管平台（如 Docker）集成。

Blazor 优势：

复制代码

• 1
• 2
• 3
• 4
• 5
• 6

language-markdown 1. 使用 C# 代替 JavaScript 来编写代码。 2. 利用现有的 .NET 库生态系统。 3. 在服务器和客户端之间共享应用逻辑。 4. 受益于 .NET 的性能、可靠性和安全性。 5. 在 Windows、Linux 和 macOS 上使用 Visual Studio 保持高效工作。 6. 以一组稳定、功能丰富且易用的通用语言、框架和工具为基础来进行生成。

2.为什么选择MASA Blazor？能用来干什么？

MASA Blazor是一个基于 Blazor Component 和 Material Design 的 UI 组件库。
dotNET开发者不需要懂得javascript就能开发一个企业级中后台系统。
MASA Blazor优势：

• 丰富组件：包含Vuetify 1:1还原的基础组件，以及很多实用的预置组件和.Net深度集成功能，包括Url、面包 屑、导航三联动，高级搜索，i18n等。
• UI设计语言：设计风格现代，UI 多端体验设计优秀。
• 简易上手：丰富详细的上手文档，免费的视频教程（制作中）。
• 社区活跃鼓励：用户参与实时互动，做出贡献加入我们，构建最开放的开源社区。
• 长期支持：全职团队维护，并提供企业级支持。
• 专业示例：MASA Blazor Pro提供多种常见场景的预设布局。

MASA Blazor Pro预设布局示例：

看到这里是不是有同学对此感兴趣起来了呢！那么这样的布局页面是怎么构建出来的呢？我们自己能不能也搭建一个这样的布局呢！嘿嘿！不要着急、我们接着往下看。

3.使用MASA Blazor模板创建第一个Blazor程序

1.首先安装Masa.Template模板

（1）检查本机.Net SDK版本，请确保已安装.NET6.0

（2）安装 Masa.Template模板,包含 MASA 系列所有项目模板
dotnet new --install Masa.Template

2.创建项目

dotnet new masab -o MasaBlazorApp
默认为Server模式 可通过参数–Mode WebAssembly 创建 WebAssembly 模式项目

3.配置 MASA Blazor（由于我这里使用了模板，以下配置在模板中都已经帮我们配好了，安装模板后直接dotnet run 即可；未安装模板的同学，按下面步骤配置即可）

（1）安装NuGet包

复制代码

• 1

language-mipsasmdotnet add package Masa.Blazor

（2）引入资源文件（我这里为Blazor Server）

在 Pages/_Layout.cshtml 中引入资源文件

（3）注入相关服务

在 Program.cs 中添加 Masa.Blazor 相关服务

复制代码

• 1
</