news 2026/6/15 17:18:02

一套基于 Ant Design 和 Blazor 的企业级组件库

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
一套基于 Ant Design 和 Blazor 的企业级组件库

致力于挖掘功能强大、性能优越、创新前沿且简单易用的 C#/.NET 开源框架、项目、类库与工具。助力 .NET 开发者轻松解锁并运用这些实用的宝藏资源,提升开发效率与创新能力!

项目介绍

Ant Design Blazor 是一套基于 Ant Design 和 Blazor 的企业级组件库,旨在为开发者提供开箱即用的高质量 Blazor 组件,适用于多种托管方式,并支持丰富的国际化语言。该项目由.NET Foundation 支持,基于 MIT 开源协议,商业应用免费。

应用场景

Ant Design Blazor 组件库适用于构建企业级中后台产品,包括但不限于:

  • 管理后台:为各种业务系统提供统一的管理界面。

  • 数据分析平台:展示和分析业务数据。

  • 企业级仪表板:实时监控业务指标和关键绩效指标(KPI)。

  • 跨平台应用:支持在.NET MAUI、WPF、Windows Forms 等 Blazor 混合客户端环境中使用,以及 Electron 等基于 Web 标准的环境。

功能模块

Ant Design Blazor 提供了丰富的功能模块,包括但不限于:

  • 基础组件:按钮、表单、输入框、选择器等。

  • 数据展示组件:表格、树形控件、标签页、卡片等。

  • 反馈组件:对话框、通知、加载指示器等。

  • 导航组件:菜单、面包屑、步骤条等。

  • 布局组件:栅格系统、布局容器等。

  • 高级组件:图表、地图、富文本编辑器等(部分通过集成第三方库实现)。

功能特点

  • 提炼自企业级中后台产品的交互语言和视觉风格:遵循 Ant Design 的设计规范,提供一致的交互体验和视觉风格。

  • 开箱即用的高质量 Blazor 组件:组件经过精心设计和优化,可直接在项目中引用和使用。

  • 支持多种托管方式:包括 WebAssembly 静态托管和基于 SignalR 的服务端 UI 即时交互。

  • 支持渐进式 Web 应用(PWA):提升 Web 应用的用户体验和性能。

  • 使用 C# 构建:多范式静态语言带来高效的开发体验,支持 .NET Core 3.1 以上所有版本。

  • 国际化支持:提供数十个国际化语言支持,满足不同地区用户的需求。

安装与使用

先决条件

  • 安装.NET Core SDK 3.1 以上版本,推荐 .NET 8。

  • 对于样式文件和互操作所需 TS 文件的构建,需要安装 Node.js。

安装方式

从模板创建一个新项目

# 安装模板 $ dotnet new --install AntDesign.Templates # 从模板创建 Ant Design Blazor Pro 项目 $ dotnet new antdesign -o MyAntDesignApp

模板参数说明:

  • -f|--full:如果设置这个参数,会生成所有 Ant Design Pro 页面(bool 类型,默认 false)。

  • -ho|--host:指定托管模型('webapp' | 'wasm' | 'server',默认 'webapp')。

  • --styles:指定样式构建类型(css | less,默认 css)。

  • --no-restore:如果设置这个参数,就不会自动恢复包引用(bool 类型,默认 false)。

在已有项目中引入 Ant Design Blazor

# 进入应用的项目文件夹,安装 Nuget 包引用 $ dotnet add package AntDesign

在项目的Program.cs中注册相关服务:

builder.Services.AddAntDesign();

或者在Startup.cs中:

services.AddAntDesign();

_Imports.razor中加入命名空间:

@using AntDesign

在适当的位置引入 CSS 和 JS 文件。WebApp 项目在App.razor中引入,WebAssembly 项目在index.html中引入:

<link href="_content/AntDesign/css/ant-design-blazor.css" rel="stylesheet"> <script src="_content/AntDesign/js/ant-design-blazor.js"></script>

为了动态地显示弹出组件,需要在App.razor中添加一个<AntContainer />组件。

项目演示

开源地址

https://gitee.com/ant-design-blazor/ant-design-blazor

版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/6/12 13:42:34

PyTorch镜像安装requests失败?国内源配置教程

PyTorch镜像安装requests失败&#xff1f;国内源配置教程 1. 问题背景与环境介绍 在深度学习开发过程中&#xff0c;使用预配置的PyTorch镜像可以极大提升开发效率。本文所讨论的镜像是基于官方PyTorch底包构建的通用开发环境&#xff08;PyTorch-2.x-Universal-Dev-v1.0&…

作者头像 李华
网站建设 2026/6/15 16:40:57

基于大数据爬虫+Hadoop+深度学习的商品管理系统设计与实现开题报告

基于大数据爬虫Hadoop深度学习的商品管理系统设计与实现开题报告 一、研究背景与意义 &#xff08;一&#xff09;研究背景 在数字经济与电商行业高速发展的背景下&#xff0c;商品数据呈现爆炸式增长态势。截至2025年&#xff0c;我国电商平台商品总量突破10亿种&#xff0c;日…

作者头像 李华
网站建设 2026/6/8 10:50:02

AnimeGANv2多端同步技巧:手机拍照→云端处理→PC下载

AnimeGANv2多端同步技巧&#xff1a;手机拍照→云端处理→PC下载 你是不是也经常在旅行途中看到绝美的风景&#xff0c;心里想着“这要是变成动漫画面一定超梦幻”&#xff1f;但拍完照传电脑、再用软件处理&#xff0c;来回传输文件太麻烦&#xff0c;等你终于导出图片&#…

作者头像 李华
网站建设 2026/6/15 13:38:48

为什么选择MinerU做论文解析?CPU适配部署教程告诉你答案

为什么选择MinerU做论文解析&#xff1f;CPU适配部署教程告诉你答案 1. 背景与需求&#xff1a;学术文档处理的效率瓶颈 在科研和工程实践中&#xff0c;研究人员每天需要处理大量PDF格式的学术论文、技术报告和图表资料。传统方式依赖手动阅读、复制文本、分析图表&#xff…

作者头像 李华
网站建设 2026/6/15 13:38:56

vllm监控方案:HY-MT1.5-1.8B服务健康检查

vllm监控方案&#xff1a;HY-MT1.5-1.8B服务健康检查 1. 背景与业务场景 随着多语言内容交互需求的快速增长&#xff0c;高质量、低延迟的翻译服务成为智能应用的核心能力之一。混元翻译模型&#xff08;Hunyuan-MT&#xff09;系列在多个国际评测中表现优异&#xff0c;其中…

作者头像 李华
网站建设 2026/6/15 13:35:26

BGE-Reranker-v2-m3 Docker部署:容器化封装实战案例

BGE-Reranker-v2-m3 Docker部署&#xff1a;容器化封装实战案例 1. 引言 1.1 业务场景描述 在当前的检索增强生成&#xff08;RAG&#xff09;系统中&#xff0c;向量数据库通过语义相似度进行初步文档召回&#xff0c;但其基于Embedding的匹配方式容易受到关键词干扰&#…

作者头像 李华