LeeUI

一个支持 TypeScript 的简单单实例 Vue 3 组件库，基于 Element Plus 进行封装，提供便捷的表单渲染功能。

🚀 特性

• 📌 基于 Vue 3 + TypeScript，类型安全，支持 Vite。
• 🎨 Element Plus 兼容，二次封装，优化开发体验。
• ⚡ 动态表单渲染，支持 schema 配置化表单。
• 💡 可扩展性强，方便集成和定制。

📦 安装

使用 npm 或 yarn 进行安装：

npm install @uf_lee/leeui

或

yarn add @uf_lee/leeui

🚀 快速开始

示例及测试代码

git clone https://gitee.com/uf_lee/lee-ui-test.git

📖 API 说明

LElForm 组件

| 参数 | 说明 | 类型 | 默认值 | | -------- | ------ | --------------------- | ---- | | schema | 表单配置项 | FormSchema[] | [] | | model | 表单数据对象 | Record<string, any> | {} | | rules | 表单验证规则 | Record<string, any> | {} | | register | 注册组件 | Register | - | @register="register" |

LElCom 组件

| 参数 | 说明 | 类型 | 默认值 | 案例 | | --------- | ------- | ------------ | --- | ---| | data | 单个表单项配置 | ComData | - | :data="data" | | v-model | 绑定的数据值 | any | - | v-model="value" |

LElTable 组件

| 参数 | 说明 | 类型 | 默认值 | 案例 | | --------- | ------- | ------------ | --- | ---| | schema | 表格配置项 | TableSchema[] | [] | :schema="schema" | | data | 表格数据对象 | Record<string, any> | {} | :data="tableData" | | register | 注册表格组件 | TableRegister | - | @register="register" | | isForm | 是否为表单模式 | boolean | false | :isForm="true" | | rules | 表单验证规则 | Record<string, any> | {} | :rules="rules" |

本地调试方法

1. 在lee-ui目录下执行：

cd c:\www\leeui\lee-ui
npm link

2. 在需要使用的项目目录下执行：

cd c:\www\leeui\lee-ui-test
npm link @uf_lee/leeui

3. 在依赖项目中解除链接

cd c:\www\leeui\lee-ui-test
npm unlink @uf_lee/leeui

4. （可选）在 leeui 项目中解除全局链接

cd c:\www\leeui\lee-ui
npm unlink @uf_lee/leeui

注意：需要执行npm run build 代码才会生效

本地调试方案2：使用软链接

1. 配置 package.json 文件：

"@uf_lee/leeui": "file:../lee-ui",

2. 然后执行

cd c:\www\leeui\lee-ui-test
npm install @uf_lee/leeui

3. 注意：lee-ui需要执行npm run build 代码才会生效

cd c:\www\leeui\lee-ui
npm run build

4. 恢复

npm uninstall @uf_lee/leeui
npm install @uf_lee/leeui

🤝 贡献指南

欢迎贡献代码！请提交 PR 或 Issue 进行讨论。

1. Fork 本仓库。
2. 创建新分支：git checkout -b feature-branch。
3. 提交更改：git commit -m 'Add some feature'。
4. 推送分支：git push origin feature-branch。
5. 提交 Pull Request。

📜 License

MIT License