根据官方文档介绍:Blazor 是一个用于使用 .NET 生成交互式客户端 Web UI 的框架。这个框架类似于当下比较热门的 React、Vue 等前端框架,但不同的是,Blazor 可以让我们使用 C# 代替 JavaScript 来创建丰富的交互式网页。这样一来,ASP.Net 程序员可以快速变身全栈程序员,对于 .Net 开发人原来说,使用 Blazor 框架有以下优势:
- 使用 C# 代替 JavaScript 来编写代码。
- 利用现有的 .NET 库生态系统。
- 在服务器和客户端之间共享应用逻辑。
- 受益于 .NET 的性能、可靠性和安全性。
- 始终高效支持 Windows、Linux 和 macOS 上的 Visual Studio。
- 以一组稳定、功能丰富且易用的通用语言、框架和工具为基础来进行生成。
![e12962137859af3bcb011a81adccc340.png](https://i-blog.csdnimg.cn/blog_migrate/b595408425bffad81e153208b63bfa26.jpeg)
Blazor 拥有现代流行的 Web 框架的功能和优点:
- 可重用的 UI 组件
- 数据绑定
- 处理用户事件
- 客户端路由
- 组件布局
- 对依赖注入的支持
- 表单与验证
- 构建组件库,可以嵌套和重用
- 服务器端渲染
- 能够通过 asm.js 在较早版本的(非 WebAssembly )浏览器上运行
- 开源免费
并且还支持与 JavaScript 互操作,可以使用丰富的第三方 JS 库,C# 代码可以调用到 JavaScript 代码,而 JavaScript 代码可以调用到 C# 代码。
![3f918c26f1c19423024c18b2fefec499.png](https://i-blog.csdnimg.cn/blog_migrate/04c4e0eb7f89c68ea914a182d0571b49.jpeg)
C# 与 JavaScript 互操作
对于 .Net 程序员来说,Blazor 上手非常容易,打开 Visual Studio 2019 使用模板创建一个 Blazor 项目:
![71f71b1949dc9f1a1a0429066c50b3d0.png](https://i-blog.csdnimg.cn/blog_migrate/16b5cdb6bb7c92b62e71cee747c5f58a.jpeg)
选择 Blazor 应用
![9f5ab17fcf7675269780fa2ac92df6e4.png](https://i-blog.csdnimg.cn/blog_migrate/6af2a639e4658e49a8d81bf50ab51332.jpeg)
填写项目名称
![e4a15a4f9388db701bee01f3a4062868.png](https://i-blog.csdnimg.cn/blog_migrate/f9bbdc6aeff059ae71d32d4351e99884.jpeg)
点击创建
![e337688bf3bfdca5d5284535f11de7e8.png](https://i-blog.csdnimg.cn/blog_migrate/09b793bbf9c73aef3cbf657881d2c48b.jpeg)
可以运行项目
![e3ed266c7dfeccb47d524a9f649f1411.gif](https://i-blog.csdnimg.cn/blog_migrate/0a5b3cf7f2b37c351994546103bd1732.gif)
生成单页面应用界面