ABP Framework Blazor UI
架構 overview
ABP Blazor UI 系統構建在 Blazorise 組件庫之上，為構建數據驅動應用提供結構化方法，包含 CRUD 操作、主題和本地化的一致模式。
核心組件和依賴
Blazor UI 系統以Volo.Abp.BlazoriseUI包為中心，與 Blazorise 組件庫集成，提供 ABP 特定功能。
CRUD 頁面系統
AbpCrudPageBase<T>類為在 Blazor 應用程序中實現創建、讀取、更新、刪除操作提供標準化模式，包括對分頁、排序、過濾和基于權限的操作的內置支持。
CRUD 頁面基類結構
AbpCrudPageBase類層次結構提供多個重載以適應不同場景：
| 類簽名 | 用例 |
|---|---|
AbpCrudPageBase<TAppService, TEntityDto, TKey> | 使用默認請求 DTO 的基本 CRUD |
AbpCrudPageBase<TAppService, TEntityDto, TKey, TGetListInput> | 自定義列表輸入 DTO |
AbpCrudPageBase<TAppService, TEntityDto, TKey, TGetListInput, TCreateInput> | 自定義創建輸入 DTO |
AbpCrudPageBase<TAppService, TEntityDto, TKey, TGetListInput, TCreateInput, TUpdateInput> | 完全自定義 |
關鍵屬性和方法
| 成員 | 類型 | 用途 |
|---|---|---|
AppService | TAppService | 注入的應用服務 |
Entities | IReadOnlyList<TListViewModel> | 當前頁面實體 |
NewEntity | TCreateViewModel | 正在創建的實體 |
EditingEntity | TUpdateViewModel | 正在編輯的實體 |
CreateModal, EditModal | Modal | Blazorise 模態框引用 |
GetEntitiesAsync() | Task | 從服務器加載實體 |
CreateEntityAsync() | Task | 創建新實體 |
UpdateEntityAsync() | Task | 更新現有實體 |
DeleteEntityAsync() | Task | 刪除實體 |
示例實現
Identity 模塊的UserManagement組件演示了 CRUD 模式：
@inherits AbpCrudPageBase<IIdentityUserAppService, IdentityUserDto, Guid, GetIdentityUsersInput, IdentityUserCreateDto, IdentityUserUpdateDto>
數據網格和擴展系統
AbpExtensibleDataGrid<T>組件提供功能豐富的數據網格，內置對分頁、排序以及可擴展列和操作的支持。
數據網格組件架構
表格列配置
TableColumn類提供廣泛的自定義選項：
| 屬性 | 類型 | 用途 |
|---|---|---|
Title | string | 列標題文本 |
Data | string | 屬性路徑或字段名 |
Width | string | 列寬（CSS） |
Sortable | bool | 啟用/禁用排序 |
Visible | bool | 顯示/隱藏列 |
Component | Type | 自定義組件類型 |
ValueConverter | Func<object, string> | 值轉換函數 |
DisplayFormat | string | 顯示格式字符串 |
Actions | List<EntityAction> | 關聯操作 |
實體操作系統
實體操作為網格行提供上下文操作：
| 屬性 | 類型 | 用途 |
|---|---|---|
Text | string | 操作顯示文本 |
Clicked | Func<object, Task> | 點擊事件處理程序 |
Visible | Func<object, bool> | 可見性條件 |
Disabled | bool | 啟用/禁用狀態 |
Color | object | 操作按鈕顏色 |
Icon | string | 圖標標識符 |
ConfirmationMessage | Func<object, string> | 確認對話框文本 |
項目模板和托管模型
ABP 提供多個 Blazor 項目模板，支持不同的托管模型和架構模式。
模板結構
| 模板類型 | 項目結構 | 托管模型 |
|---|---|---|
Blazor Server | 具有服務器端渲染的單個項目 | Server |
Blazor WebAssembly | 客戶端/服務器分離 | WebAssembly |
Blazor WebApp | 混合自動渲染 | Auto |
Blazor Tiered | 具有身份驗證服務器的多層 | Server/WebAssembly |
關鍵包引用
模板包括跨托管模型的一致包引用：
<PackageReference Include="Blazorise.Bootstrap5" Version="1.8.0" />
<PackageReference Include="Blazorise.Icons.FontAwesome" Version="1.8.0" />
<PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="9.0.5" />
模塊集成
ABP 模塊提供與核心 Blazor UI 系統無縫集成的 Blazor UI 組件。每個模塊遵循組件組織和依賴關系的一致模式。
模塊結構模式
示例模塊實現
租戶管理模塊演示了標準模塊模式：
- 模塊類：
AbpTenantManagementBlazorModule配置依賴項和服務 - CRUD 頁面：
TenantManagement.razor繼承自AbpCrudPageBase - 導航：
TenantManagementBlazorMenuContributor添加菜單項 - 本地化：與
AbpTenantManagementResource集成
常見模塊依賴項
所有 Blazor 模塊共享以下依賴模式：
<ProjectReference Include="Volo.Abp.AspNetCore.Components.Web.Theming" />
<ProjectReference Include="Volo.Abp.AutoMapper" />
<PackageReference Include="[Module].Application.Contracts" />
![第十六屆藍橋杯青少組C++省賽[2025.8.9]第二部分編程題（1 、慶典隊列）](http://pic.xiahunao.cn/第十六屆藍橋杯青少組C++省賽[2025.8.9]第二部分編程題（1 、慶典隊列）)
![[C++] Git 使用教程（從入門到常用操作）](http://pic.xiahunao.cn/[C++] Git 使用教程（從入門到常用操作）)
