項目介紹
演示系統地址：https://www.blazor.zone
Blazor 是一個使用 .NET 生成交互式客戶端 Web UI 的框架：
- 使用 C# 代替 JavaScript 來創建豐富的交互式 UI。
- 共享使用 .NET 編寫的服務器端和客戶端應用邏輯。
- 將 UI 呈現為 HTML 和 CSS，以支持眾多瀏覽器，其中包括移動瀏覽器。
使用 .NET 進行客戶端 Web 開發可提供以下優勢：
- 使用 C# 代替 JavaScript 來編寫代碼。
- 利用現有的 .NET 庫生態系統。
- 在服務器和客戶端之間共享應用邏輯。
- 受益於 .NET 的性能、可靠性和安全性。
- 始終高效支持 Windows、Linux 和 macOS 上的 Visual Studio。
- 以一組穩定、功能豐富且易用的通用語言、框架和工具為基礎來進行生成。
本項目是利用 Bootstrap 樣式進行封裝的 UI 組件庫，本項目托管在Gitee上
項目地址： 傳送門
演示系統地址：https://www.blazor.zone
該組件庫現階段一共包含組件71個，歡迎各位提出issue 傳送門，提出bug、增加功能以及增加更多的組件，更加方便各位在項目中的使用，同時issue也是查找問題的好地方，在這你也許能遇到與你有相同困惑的小伙伴，說不定已經提出解決方案；
| 序號 | 類別 | 組件 | 描述 |
| 1 | 布局 | Divider 分割線 | 區隔內容的分割線 |
| 2 | Layout 布局 | 用於布局的容器組件，方便快速搭建頁面的基本結構 | |
| 3 | Footer 頁腳組件 | 顯示在網頁的最下方，提供返回頂端按鈕 | |
| 4 | Scroll 滾動條 | 給高度或者寬度超標的組件增加滾動條 | |
| 5 | Skeleton 骨架屏 | 在需要等待加載內容的位置提供一個占位圖形組合 | |
| 6 | Split 面板分割 | Split 面板分割 | |
| 7 | 導航 | Breadcrumb 面包屑 | 顯示當前頁面的路徑，快速返回之前的任意頁面 |
| 8 | Menu 導航菜單 | 為頁面和功能提供導航的菜單列表 | |
| 9 | Nav 導航組件 | 為網站提供導航功能的菜單 | |
| 10 | Dropdown 下拉菜單 | 將動作或菜單折疊到下拉菜單中 | |
| 11 | GoTop 返回頂端組件 | 點擊后返回指定容器的頂端 | |
| 12 | Pagination 分頁 | 當數據量過多時，使用分頁分解數據 | |
| 13 | Steps 步驟條 | 引導用戶按照流程完成任務的導航條 | |
| 14 | Tabs 標簽頁 | 分隔內容上有關聯但屬於不同類別的數據集合。 | |
| 15 | 表單 | EditorForm 表單組件 | 通過綁定數據模型自動呈現編輯表單 |
| 16 | ValidateForm 表單組件 | 可供數據合規檢查的表單組件 | |
| 17 | AutoComplete 自動完成 | 輸入框自動完成功能 | |
| 18 | Button 按鈕 | 常用的操作按鈕 | |
| 19 | Checkbox 多選框 | 一組備選項中進行多選 | |
| 20 | CheckboxList 多選框組 | 控件用於創建多選的復選框組 | |
| 21 | DatePicker 日期選擇器 | 用於選擇或輸入日期 | |
| 22 | DateTimeRange 日期時間段選擇器 | 在同一個選擇器里選擇一段日期 | |
| 23 | DropdownList 下拉框 | 當選項過多時，使用下拉菜單展示並選擇內容（建議使用Select組件） | |
| 24 | Editor 富文本框 | 將輸入的文字轉化為 html 代碼片段 | |
| 25 | Input 輸入框 | 通過鼠標或鍵盤輸入字符 | |
| 26 | InputNumber 組件 | 僅允許輸入標准的數字值，支持自定義范圍及其他高級功能 | |
| 27 | Markdown 編輯器 | 提供 Markdown 語法支持的文本編輯器 | |
| 28 | Radio 單選框 | 在一組備選項中進行單選 | |
| 29 | Rate 評分 | 評分組件 | |
| 30 | Select 選擇器 | 當選項過多時，使用下拉菜單展示並選擇內容 | |
| 31 | MultiSelect 多項選擇器 | 當進行多項選項時，使用下拉菜單展示並提供搜索多項選擇內容 | |
| 32 | Slider 滑塊 | 通過拖動滑塊在一個固定區間內進行選擇 | |
| 33 | Switch 開關 | 提供最普通的開關應用 | |
| 34 | Textarea 多行文本框 | 用於錄入大量文字 | |
| 35 | Toggle 開關 | 提供最普通的開關應用，值為 true false | |
| 36 | Transfer 穿梭框 | - | |
| 37 | Upload 上傳 | 通過點擊或者拖拽上傳文件 | |
| 38 | 數據 | Avatar 頭像 | 用圖標、圖片或者字符的形式展示用戶或事物信息 |
| 39 | Badge 徽章組件 | 出現在按鈕、圖標旁的數字或狀態標記 | |
| 40 | Card 卡片 | 將信息聚合在卡片容器中展示 | |
| 41 | Calendar 日歷框 | 按照日歷形式展示數據的容器。當數據是日期或按照日期划分時，例如日程、課表、價格日歷等，農歷等。目前支持年/月切換 | |
| 42 | Captchas 滑塊驗證碼 | 通過拖動滑塊進行人機識別 | |
| 43 | Carousel 走馬燈 | 在有限空間內，循環播放同一類型的圖片、文字等內容 | |
| 44 | Chart 圖表 | 通過給定數據，繪畫各種圖表的組件 | |
| 45 | Circle 進度環 | 圖表類組件。一般有兩種用途：
|
|
| 46 | Collapse 折疊面板 | 通過折疊面板收納內容區域 | |
| 47 | ListView 列表視圖 | 提供規則排列控件 | |
| 48 | Popover 彈出窗組件 | 點擊/鼠標移入元素，彈出氣泡式的卡片浮層 | |
| 49 | QRCode 二維碼 | 用於二維碼生成 | |
| 50 | Search 搜索框 | 用於數據搜索 | |
| 51 | Table 表格 | 用於展示多條結構類似的數據，可對數據進行排序、篩選、對比或其他自定義操作，內置超多功能，滿足你各種應用場景 | |
| 52 | Tag 標簽 | 用於標記和選擇 | |
| 53 | Timeline 時間線 | 可視化地呈現時間流信息 | |
| 54 | Tooltip 提示工具條 | 提供鼠標懸停或者獲得焦點后顯示提示框 | |
| 55 | Tree 樹形控件 | 用清晰的層級結構展示信息，可展開或折疊 | |
| 56 | BarcodeReader 條碼掃描 | 本組件通過調用攝像頭對條碼進行掃描，獲取到條碼內容條碼/QR碼 | |
| 57 | Camera 攝像頭拍照組件 | 本組件通過調用攝像頭進行拍照操作 | |
| 58 | Handwritten 手寫簽名 | 桌面瀏覽器測試請用F12模擬為觸摸設備 | |
| 59 | 消息 | Alert 警告 | 用於頁面中展示重要的提示信息 |
| 60 | Console 控制台 | 控制台組件，一般用於后台任務的輸出 | |
| 61 | Dialog 對話框組件 | 通過注入服務調用 Show 方法彈出窗口進行人機交互 | |
| 62 | Drawer 抽屜 | 呼出一個臨時的側邊欄, 可以從多個方向呼出 | |
| 63 | Message 消息提示 | 常用於主動操作后的反饋提示。與 Toast 的區別是后者更多用於系統級通知的被動提醒 | |
| 64 | Modal 模態框 | 在保留當前頁面狀態的情況下，告知用戶並承載相關操作 | |
| 65 | Light 指示燈 | 提供各種狀態的指示燈 | |
| 66 | Popconfirm 氣泡確認框 | 點擊元素，彈出氣泡確認框 | |
| 67 | Progress 進度條 | 用於展示操作進度，告知用戶當前狀態和預期 | |
| 68 | Spinner 旋轉圖標 | 加載數據時顯示動效 | |
| 69 | SweetAlert 彈窗組件 | 模態對話框，多用於動作過程中進行詢問后繼續，或者顯示執行結果 | |
| 70 | Toast 輕量彈窗 | 提供輕量級 Toast 彈窗 | |
| 71 | Timer 計時器 | 用於時間倒計時 |
以上是該組件庫現階段所有組件的基本介紹。歡迎各位大佬使用。
寫在最后
希望大佬們看到這篇文章，能給項目點個star支持下，感謝各位！
star流程：
1、訪問點擊項目鏈接：BootstrapBlazor;
2、點擊star，如下圖，即可完成star，關注項目不迷路：
另外還有兩個GVP項目，大佬們方便的話也點下star唄，非常感謝：
BootstrapAdmin 項目地址：
https://gitee.com/LongbowEnterprise/BootstrapAdmin
SliderCaptcha 項目地址：
https://gitee.com/LongbowEnterprise/SliderCaptcha
交流群（QQ）
BootstrapAdmin & Blazor（795206915）歡迎加群討論。