大家好，我是沙漠盡頭的狼。 .NET是免費，跨平臺，開源，用於構建所有應用的開發人員平臺。 本文演示如何在WPF中使用Blazor開發漂亮的UI，為客戶端開發註入新活力。 註 要使WPF支持Blazor，.NET版本必須是 6.0 或更高版本，本文所有示例使用的.NET 7.0，版本要求見鏈接，截圖 ...
大家好，我是沙漠盡頭的狼。
.NET是免費，跨平臺，開源，用於構建所有應用的開發人員平臺。
本文演示如何在WPF中使用Blazor開發漂亮的UI，為客戶端開發註入新活力。
註 要使WPF支持Blazor，.NET版本必須是 6.0 或更高版本，本文所有示例使用的.NET 7.0，版本要求見鏈接，截圖看如下文字：
1. WPF預設程式
本文從創建WPF Hello World開發：
使用WPF模板創建一個預設程式，取名【WPFBlazorChat】，項目組織結構如下：
運行項目，一個空白視窗：
接著往下看，我們添加Blazor支持，本小節代碼在這WPF預設程式源碼。
2. 添加Blazor支持
依然使用上面的工程，添加Blazor支持，此部分參考微軟文檔生成 Windows Presentation Foundation (WPF) Blazor 應用，本小節快速略過。
2.1 編輯工程文件
雙擊工程文件WPFBlazorChat.csproj，修改處如下：
- 在項目文件的頂部，將 SDK 更改為
Microsoft.NET.Sdk.Razor。 - 添加節點
<RootNameSpace>WPFBlazorChat</RootNameSpace>，將項目命名空間WPFBlazorChat設置為應用的根命名空間。 - 添加
Nuget包Microsoft.AspNetCore.Components.WebView.Wpf，版本看你選擇的.NET版本而定。
2.2 添加_Imports.razor文件
_Imports.razor文件類似一個Global using文件，專門給Razor組件使用，放置一些用的比較多的全局的命名空間，精簡代碼。
內容如下，引入了一個命名空間Microsoft.AspNetCore.Components.Web，這是Razor常用命名空間，包含用於向 Blazor 框架提供有關瀏覽器事件的信息的類型。：
@using Microsoft.AspNetCore.Components.Web
2.3 添加wwwroot\index.html文件
和Vue、React一樣，需要一個html文件承載Razor組件，頁面內容類似：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>WPFBlazorChat</title>
<base href="/" />
<link href="css/app.css" rel="stylesheet" />
<link href="WpfBlazor.styles.css" rel="stylesheet" />
</head>
<body>
<div id="app">Loading...</div>
<div id="blazor-error-ui">
An unhandled error has occurred.
<a href="" class="reload">Reload</a>
<a class="dismiss">
