低代码产品表单渲染架构

在React和Vue没有流行起来的时候,低代码产品的表单渲染设计通常会使用操作Dom的方式实现。

下面是一个表单的例子:

产品层

用户通过打开表单,使用不同业务场景业务下的表单页面,中间的Render层就是技术实现。

每一个不同业务的表单页面就是低代码产品中的一个元素。

技术层

渲染层的核心在于View和Controller,现代基于框架实现一般是MVVM的实现。上面是基于传统的前端框架实现(Jquery),少了M层,也就是Model。其实Model是在Controller层内部实现。

Controller层实现了数据的获取和传递,以及继承了第三方框架的能力(Jquery)

View层是表单控件的渲染和内部逻辑处理实现,包括渲染哪些控件,如何校验和响应控件事件等

View层中的Controls是所有表单控件的集合,通过对应不同的类型渲染不同的控件,例如:输入框,选择框等等。

View层中的IControl实现了每一个控件的基本属性和能力,Controls中的每个控件通过继承他来实现自己特有的功能。

View层可以被拓展,可以被添加其他属性。

相关推荐
mpp0071 天前
《从需求到上线:CodeWave SpecDriven 模式企业级应用开发全流程指南》
低代码·aigc
踩着两条虫1 天前
VTJ 平台六大设计模式落地实战指南
开发语言·前端·人工智能·低代码·设计模式·重构·架构
工业甲酰苯胺1 天前
2026 产业 AI 爆发:JNPF 助企业少走 3 年弯路
人工智能·算法·低代码
踩着两条虫1 天前
VTJ: 区块管理功能
vue.js·低代码·ai编程
踩着两条虫1 天前
VTJ:页面管理功能
前端·低代码·ai编程
微刻时光2 天前
影刀RPA:For循环与ForEach循环深度解析与实战指南
人工智能·python·低代码·自动化·rpa·影刀实战
摩尔元数2 天前
2026摩尔元数AI转型:以AI原生智能体,重构新一代工业软件
人工智能·低代码·重构·制造·mes
盟接之桥2 天前
盟接之桥®制造业EDI软件:专注制造,为制造业服务,让全球供应链协同更有底气
网络·安全·低代码·汽车·制造
踩着两条虫2 天前
VTJ:ProjectModel 核心设计
低代码·架构·ai编程
踩着两条虫2 天前
VTJ:项目模型系统
前端·低代码·ai编程