介绍

  • 3 分钟

披萨配送公司聘请你来对其面向客户的 Blazor 网站进行现代化改造，其中包括披萨列表、订购页面和其他功能。 Blazor 交互式 web 应用程序使用 .NET 共享服务器和客户端代码之间的逻辑。

在更新中，需要：

  • 使用 JavaScript 对呈现的 HTML 组件进行动画处理。
  • 使用 JavaScript 库将品牌应用于警报页面。
  • 更改页面呈现完成后应用对事件的响应方式。
  • 创建并应用模板组件以更新多个页面。

本模块将介绍如何与 JavaScript 代码互操作、如何使用模板化组件以及如何响应 Blazor 中的组件生命周期事件。

学习目标

  • 在 Blazor 应用中，从 .NET 代码调用 JavaScript 函数并从 JavaScript 调用 .NET 代码。
  • 处理 Blazor 组件生命周期中的事件。
  • 创建可合并到 Blazor 应用中的可重用模板组件。

先决条件

  • 熟悉 HTML、CSS 和 JavaScript Web 开发。
  • 编写 C# 代码的新手能力。
  • 已安装 .NET 8.0 SDK。
  • 集成开发环境 (IDE)。 此模块使用 Visual Studio Code。

提示

本模块使用 .NET 命令行接口 (CLI) 和 Visual Studio Code 进行本地开发。 完成该模块后，可以应用这些概念，并通过使用 Visual Studio for Windows、Visual Studio for Mac 或 Visual Studio Code 针对 Windows、Linux 或 Mac 继续开发。

.NET 8.0 SDK

本模块使用 .NET 8.0 SDK。 通过在首选命令终端中运行以下命令，确保你已安装 .NET 8.0：

dotnet --list-sdks

将显示类似于以下示例的输出：

6.0.317 [C:\Program Files\dotnet\sdk]
7.0.401 [C:\Program Files\dotnet\sdk]
8.0.100 [C:\Program Files\dotnet\sdk]

确保列出了以 8 开头的版本。 如果未列出任何版本或未找到命令，请安装最新的 .NET 8.0 SDK。