Skip to content

wubing7755/AWComponent

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

57 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

AWUI - Blazor 自定义组件库

.NET Version Blazor Version License EN CN

🌐 Choose Language: English | 中文

基于 Blazor (.NET 6.0) 的高质量自定义组件库,提供可复用的 UI 组件和模块化解决方案。


🚀 功能特性

  • 开箱即用:预置多种企业级 UI 组件
  • 主题定制:通过 CSS 变量轻松自定义样式
  • 高性能:基于 .NET 6.0 优化渲染逻辑
  • 完整文档:内置示例页面和代码片段

📦 快速开始

前置条件

安装与运行

  1. 克隆仓库

    git clone https://github.com/your-username/AWComponent.git
  2. 运行程序:

    cd AWComponent/AW/Server
    dotnet run

    访问https://localhost:7208查看运行效果

📂 项目架构

AWComponent/
├── AWUI/                  # 组件库
│   ├── Components/        # 可复用组件
│   └── ...
│
├── AW
└── AWComponent.sln        # 解决方案文件

🔧 组件使用示例

@using AWUI.Components

<Button OnClick="HandleClick">PlaceHolder</Button>

@code{
    private void HandleClick(MouseEventArgs args)
    {
        // add your code
    }
}

NuGet 包集成

  1. 安装 AWUI NuGet 包:

    dotnet add package AWUI --version 0.0.5
  2. 服务配置(Program.cs in Client)

    builder.AddAWComponentServices();
  3. 全局配置(appsettings.json in Client.wwwroot)

    {
      "JsModules": {
        "Modules": [
          {
            "Name": "AWUI",
            "Path": "./_content/AWUI/js/AWUI.js",
            "Enable": true
          },
        ]
      }
    }
  4. 样式配置(index.html in Client.wwwroot)

    <link href="_content/AWUI/css/AWUI.css" rel="stylesheet" />
  5. _Imports.razor 中添加命名空间:

    @using AWUI.Components

🧩 支持组件

组件类型 组件名
Basic Alert、Button、Divider、Input、Label、Modal、Progress、Select、Tree

📚 文档资源

About

Custom Components

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published