🚀 即插即用的 Vue 3 业务组件库,让中后台开发回归简单
Ease UI 是一套为「快速复制」而生的 Vue 3 业务组件库。每个组件都是独立的 .vue 单文件,不依赖任何外部样式或工具函数,直接复制到你的项目即可使用。它仅依赖 Element Plus,却解决了中后台开发中表格选择混乱、搜索表单代码臃肿、日期范围绑定繁琐等真实痛点,让组件复用像复制代码一样简单
💡 项目初衷
在中后台系统开发中,我们频繁遇到这些问题:
| 痛点 | 现状 |
|-------------------------|------------------------------------------|
| 🔧 组件库太重 | 引入一套组件库,需要学习整套 API、主题配置、构建配置,成本太高 |
| 📋 复制粘贴难 | 想从项目 A 复用一个组件到项目 B,发现依赖了各种公共样式、工具函数,拆不出来 |
| 🧩 Element Plus 不够用 | 基础组件有了,但业务组件(如带展开/收起的搜索表单、智能表格)还得自己写 |
| 🔄 重复造轮子 | 每个项目都要重新实现表格选择、日期范围绑定、表单布局... |
于是,Ease UI 诞生了。
打造一套极致轻量、即拷即用的业务组件,让开发者可以像复制一段代码一样简单地复用组件。
---
✨ 核心优势
🎯 单文件组件,即拷即用
每个组件都是完全独立的 .vue 单文件,包含:
✅ 完整的 <template> 模板
✅ 独立的 <script setup> 逻辑
✅ 自包含的 <style scoped> 样式
无需任何配置,直接复制 .vue 文件到你的项目即可使用!
# 只需要这一个文件src/components/xly-button/index.vue# 不需要:❌ 额外的 CSS 文件❌ 公共样式依赖❌ 复杂的构建配置❌ 主题变量文件🔌 仅依赖 Element Plus
本组件库仅依赖 Element Plus(及其图标库),不引入其他 UI 组件库:
{ "dependencies": { "element-plus": "^2.13.6", "@element-plus/icons-vue": "^2.3.2" }}依赖说明:
🎨 Element Plus - 仅使用其图标组件(@element-plus/icons-vue)
🚫 无其他 UI 库 - 不依赖 Ant Design Vue、Naive UI、Vuetify 等
🚫 无样式库 - 不依赖 Tailwind CSS、UnoCSS 等原子类框架
📝 纯 Vue 3 + SCSS - 所有组件样式独立编写
这意味着:
如果你的项目已经使用 Element Plus,可以无缝集成
如果你的项目没有 Element Plus,只需安装它即可
不会有多个 UI 库的样式冲突问题
✨ 新增
xly-worktab(多标签页组件)src/components/xly-worktab/index.vue
- 路由切换自动添加标签页,显示菜单名称
- 支持关闭当前/左侧/右侧/其他/全部标签页
- 支持右键菜单操作
- 支持横向滚动、滚轮滚动、自动滚动到激活标签
- 固定标签(affix)不可关闭
- 标签打开/关闭动画过渡
- 配合 KeepAlive 实现页面缓存
🐛 修复
xly-permission(权限配置组件)修复禁用项仍可被全选/父节点勾选选中的问题
- nodeMap 使用统一的 getItemDisabled 函数判断禁用状态(之前仅支持 isDisabled 函数和 disabledKey,缺少 disabledField/disabledValue 支持)
- onRootToggle 全选时跳过禁用叶子节点
- onNodeToggle 勾选/取消父节点时跳过禁用叶子节点
- rootState 仅计算非禁用叶子节点,修复全选复选框在有禁用项时始终半选的问题
- 修复取消全选无效的问题(else 分支逻辑错误)
如果你觉得这个项目还不错或对你有帮助,欢迎到 Gitee 或 GitHub 上点个 Star,这是对作者最好的支持~开源不易,且用且珍惜。
🔗 Gitee:https://gitee.com/yun_hua_admin/ease-ui
🔗 GitHub:https://github.com/Momingyun/ease-ui