@xuanmo/dynamic-form
TypeScript icon, indicating that this package has built-in type declarations

0.0.1-alpha.48 • Public • Published

介绍

Dynamic Form 是基于 Vue3 开发的一套专注于表单的组件,为了解决表单繁琐的校验、联动、数据交互应运而生,不是大而全的 UI 组件库,主要通过配置的形式使用表单,尽可能达到不写代码实现一个表单的创建,类似于之前基于 Vue2 + Vant2 开发的动态表单模式,具体链接,功能会更强大。

亮点

  • 内置表单组件:输入框(Input)、单选框(Radio)、复选框(Checkbox)、开关(Switch)、评分(Rate)、选择器(Picker)、日期选择器(DatePicker)、上传(Upload);
  • 内置的其他组件:按钮(Button)、单元格(Cell)、图标(Icon)、遮罩层(Overlay)、弹出层(Popup)、间距(Space)、图片(Image);
  • 用最少的代码,完成表单的渲染;
  • 表单支持分组模式,可将信息录入进行分组展示;
  • 与其他 Vant-UIElement-plus 等组件不同的是,一个表单的渲染通过 JSON 配置即可完成,不需要进行二次封装;
  • 表单校验可以与组件业务逻辑可以做到很好的拆分,校验支持扩展等,更多用法参考 https://github.com/D-xuanmo/validator
  • 表单可支持扩展业务场景更多的组件,本质上表单组件只是针对通用逻辑、校验等场景进行封装,每个子组件按统一规范开发即可融入到表单,无需要关心数据层、校验等;
  • 更多功能开发中...

组件目前规划

组件说明

链接

  1. 项目仓库:https://github.com/D-xuanmo/dynamic-form
  2. 文档地址:https://www.xuanmo.xin/-/dynamic-form
  3. Demo:https://www.xuanmo.xin/-/dynamic-form/demo/form
  4. 数据校验:https://github.com/D-xuanmo/validator
  5. 工具方法:https://github.com/D-xuanmo/javascript-utils
  6. 在线演练场:https://run.xuanmo.xin

特别鸣谢

License

  • 本项目基于 MIT 协议,欢迎有兴趣的朋友一起交流
  • Copyright © 2022-PRESENT D-Xuanmo

动态

Alt

Readme

Keywords

Package Sidebar

Install

npm i @xuanmo/dynamic-form

Weekly Downloads

5

Version

0.0.1-alpha.48

License

MIT

Unpacked Size

550 kB

Total Files

101

Last publish

Collaborators

  • xuanmo