Lemon Form柠檬表单是一个基于 vue3 和 Typescript 开发的表单产品,作为一个重前端产品形态,表单编辑器和表单组件库所有代码完全开源。
为什么选择柠檬轻表单
- 使用简单:拖拉拽的交互方式,降低上手成本
- 动态表单渲染:轻松创建动态表单,所需配置极少。
- 完全开源:表单编辑器核心代码完全开源,对表单研发拥有完全的自主权
- 扩展能力:柠檬表单提供了扩展能力,同时官方也提供低代码出码能力,无缝具备【无码】研发能力
动态表单实现原理
动态表单的实现原理:基于JsonSchema动态渲染组件,核心在于解耦表单结构配置与组件UI呈现。
- 数据驱动模型:表单页面的UI显示,逻辑交互,数据绑定和表单提交,都是通过配置完成。动态渲染成dom,而无需直接操作DOM。
- 渲染器:在表单渲染器上,我们采用动态组件component的渲染方式,根据表单类型动态渲染不同的配置组件元素。
- 拖拉拽:在交互方式上,我们采用VueDraggable拖拉拽完成了组件的创建和顺序的更新,降低表单搭建的使用成本
安装
通过 npm 或 yarn 安装柠檬表单:
git clone git@github.com:bojue/lemon-form.git
cd lemon-form
yarn
npm run dev
仅供个人学习参考/导航指引使用,具体请以第三方网站说明为准,本站不提供任何专业建议。如果地址失效或描述有误,请联系站长反馈~感谢您的理解与支持!
链接: https://fly63.com/nav/4791