# layui-extend

**Repository Path**: bobabc/layui-extend

## Basic Information

- **Project Name**: layui-extend
- **Description**: Lyui 扩展库
- **Primary Language**: Unknown
- **License**: MulanPSL-2.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2026-06-15
- **Last Updated**: 2026-06-16

## Categories & Tags

**Categories**: Uncategorized

**Tags**: layui

## README

# Layui Extend

基于 [Layui 2.0](https://layui.dev/) 的扩展组件库。

## 简介

这是一个 Layui 扩展项目，提供额外的 UI 组件和功能扩展。包含33+组件，主题系统

## 使用

```html
<!-- 引入 Layui -->
<link rel="stylesheet" href="layui/css/layui.css">
<link rel="stylesheet" href="css/layui-pro.css">
<script src="layui/layui.js"></script>
<!--注册组件-->
<script src="layui-pro-config.js"></script>
<!--级联Demo-->
<script src="layui-pro-cascader-init.js"></script>

```

## 组件列表

### 表单组件

#### 异步按钮 (Async Button)
点击后显示 loading 状态，支持异步提交控制
![异步按钮](img/ScreenShot_2026-06-16_140034_845.png)

#### 自动完成 (Autocomplete)
支持搜索建议、键盘导航的输入框组件
![自动完成](img/ScreenShot_2026-06-16_140127_868.png)

#### 多选下拉 (MultiSelect)
支持多选的下拉选择器
![多选下拉](img/ScreenShot_2026-06-16_140156_549.png)

#### 下拉树 (TreeSelect)
树形结构的下拉选择器
![下拉树](img/ScreenShot_2026-06-16_140218_261.png)

#### 级联选择器 (Cascader)
多级联动选择器
![级联选择器](img/ScreenShot_2026-06-16_140228_446.png)

#### 提及 (Mention)
在输入框中通过 @ 或自定义字符触发提及功能
![提及](img/ScreenShot_2026-06-16_140250_092.png)

#### 气泡确认 (Popconfirm)
气泡样式的确认框
![气泡确认](img/ScreenShot_2026-06-16_140307_550.png)

#### 气泡卡片 (Popover)
气泡样式的卡片弹出层
![气泡卡片](img/ScreenShot_2026-06-16_140326_269.png)

### 布局与展示组件

#### 组织架构 (OrgChart)
企业组织架构树形展示
![组织架构](img/ScreenShot_2026-06-16_140350_299.png)

#### 项目管理看板 (Kanban)
支持拖拽的项目管理看板
![项目管理看板](img/ScreenShot_2026-06-16_140403_451.png)

#### 树形组件 (Tree)
增强的树形结构组件
![树形组件](img/ScreenShot_2026-06-16_140430_136.png)

#### 聊天组件 (Chat)
聊天气泡界面组件
![聊天组件](img/ScreenShot_2026-06-16_140449_141.png)

#### 评论组件 (Comment)
支持无限嵌套的评论系统
![评论组件](img/ScreenShot_2026-06-16_140502_079.png)

### 功能组件

#### 返回顶部 (BackTop)
回到顶部按钮组件

#### 页面加载条 (LoadingBar)
顶部页面加载进度条

#### 图片预览 (ImagePreview)
图片查看器，支持缩放、旋转、拖拽

#### 水印 (Watermark)
页面水印防泄露组件

#### 通知 (Notification)
全局通知提示组件

#### 抽屉 (Drawer)
侧边抽屉弹出层

#### 骨架屏 (Skeleton)
页面加载骨架屏占位

#### 统计数值 (Statistic)
数值统计展示组件

#### 可折叠卡片 (CollapsibleCard)
可折叠展开的卡片组件

#### 主题系统 (Theme)
支持亮色/暗色主题切换

## 预览图片

项目包含 13 张组件预览图片，位于 `img/` 目录下，展示了主要组件的视觉效果。

## 贡献

欢迎提交 Pull Request 或 Issue。

## 许可证

[MIT](LICENSE)