当前位置: 首页 > news >正文

【Ease UI】2026-04-03组件更新:新增组件xly-china-map中国地图组件

🚀 即插即用的 Vue 3 业务组件库,让中后台开发回归简单

Ease UI 是一套为「快速复制」而生的 Vue 3 业务组件库。每个组件都是独立的 .vue 单文件,不依赖任何外部样式或工具函数,直接复制到你的项目即可使用。它仅依赖 Element Plus,却解决了中后台开发中表格选择混乱、搜索表单代码臃肿、日期范围绑定繁琐等真实痛点,让组件复用像复制代码一样简单。


✨ 新增

  • xly-china-map多数据集功能增强
  • 支持传入多组数据集(如 2023年/2024年 GDP 对比)
  • MapDataSet数据结构:支持namedatacolorRange自定义颜色
  • 对比模式tooltip-mode="compare",默认):悬浮省份时 Tooltip 同时展示所有数据集的数据,直观对比
  • 切换模式tooltip-mode="switch"):通过 Tab 切换数据集,Tooltip 只显示当前数据
  • 数据集 Tab 样式优化:白色底 + 连体圆角边框 + 选中态蓝色高亮



💡 项目初衷

在中后台系统开发中,我们频繁遇到这些问题:

痛点现状
🔧组件库太重引入一套组件库,需要学习整套 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 库的样式冲突问题

如果你觉得这个项目还不错或对你有帮助,欢迎到 Gitee 或 GitHub 上点个 Star,这是对作者最好的支持~开源不易,且用且珍惜。

也欢迎关注公众号【Ease UI开源】,不错过最新的更新动态。

🔗 Gitee:https://gitee.com/yun_hua_admin/ease-ui
🔗 GitHub:https://github.com/Momingyun/ease-ui
🔗 预览地址:http://1.14.65.79

http://www.jsqmd.com/news/588641/

相关文章:

  • 示波器眼图分析实战:如何从颜色分布一眼看穿信号质量(附实测案例)
  • AI Agent架构入门到精通:LangChain重磅DeepAgents深度拆解,看这一篇就够了!
  • AO3镜像站终极访问指南:3步解决同人作品访问难题
  • 终极指南:3个简单步骤让旧款Mac安装最新macOS系统
  • Phi-4-mini-reasoning参数详解:presence_penalty对重复结论的抑制效果
  • Obsidian的插件Claudian报错
  • LLM智能体入门到精通:一文看透“共同进化”Complementary RL,看这篇就够了!
  • LLM个人知识库入门基础教程(非常详细),跟着Karpathy学AI正确打开方式,收藏这一篇就够了!
  • RAG 知识库检索参数怎么调?一篇讲清 top_k、BM25、Rerank、各种阈值的区别
  • 计算机毕业设计:Python新能源汽车数据分析与个性化推荐系统 Django框架 snowNLP 协同过滤推荐算法 requests爬虫 可视化(建议收藏)✅
  • seo 推广公司一般多久能见效果_seo 推广公司是否值得信赖
  • SCANET2~5 能力差异速查:上位机路数、隔离、扩展口怎么理解
  • IDEA鲜亮配色方案实战:Java/Mapper.xml/yml文件高亮配置指南(附下载)
  • 2026届毕业生推荐的六大降重复率神器推荐
  • YOLO X Layout部署案例:中小企业PDF文档智能解析落地实践
  • 网站SEO与用户体验的关系是什么_高质量内容创作的技巧是什么
  • WebGoat靶场通关避坑指南:从Docker部署到JWT令牌伪造的实战踩坑记录
  • MATLAB FFT 入门到实战:信号分析与频率分解的完整指南
  • 如何高效使用Sketch设计稿转HTML工具:5步实现设计到代码的智能转换
  • Python+AI:自动分析财报数据的5个实战技巧
  • 低成本搭建方案:树莓派运行OpenClaw连接千问3.5-9B云接口
  • GitHub中文界面终极指南:5分钟免费解锁中文GitHub
  • 【顶刊复现】跟网型逆变器小干扰稳定性分析与控制策略优化Matlab代码
  • 过期域名抢注对SEO优化有什么影响
  • 如何降低seo关键字价格
  • 华为ENSP OSPF实验避坑指南:配置Stub区域、路由聚合与DR选举的常见错误
  • 快马平台十分钟实战:用AI生成代码快速原型验证龙虾部署理念
  • 终极NCM音乐解密指南:快速解锁网易云音乐加密文件
  • [数智金融] [3] 关于经济数据分析模块的大致思路
  • 【电池特征提取+SOH估计】基于PINN物理信息神经网络的锂电池SOH估计 Matlab代码(多输入单输出)