低代码产品表单渲染架构

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

下面是一个表单的例子:

产品层

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

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

技术层

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

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

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

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

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

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

相关推荐
可乐鸡翅yeah_2 天前
个人 / 外包流媒体项目交付实战,M3U8 验收与问题闭环完整工作流
运维·网络·python·低代码·django·m3u8·在线播放
梦梦代码精3 天前
《LikeShop全产品技术硬核拆解:ThinkPHP8+Vue3+UniApp架构,私有化部署与二次开发实战指南》
java·低代码·系统架构·php·开源软件
许彰午3 天前
07-SqlBuilder六法
java·开发语言·低代码·架构
许彰午4 天前
14-字段级SM4加密与SM2签名
java·低代码·架构
许彰午4 天前
13-describe元数据输出
java·低代码·架构·状态模式
qq407855604 天前
中小五金建材贸易企业:进销存数字化要重点关注哪些环节?
人工智能·低代码·制造
搭贝4 天前
国资报送责任制怎么建?三级责任矩阵设计
android·数据库·人工智能·线性代数·低代码·矩阵·制造
_xaboy4 天前
开源表单设计器 FcDesigner 保存表单教程:toJson parseJson 回显
低代码·开源·vue·表单·fcdesigner
Java小卷5 天前
低代码表单联动配置:从节点驱动到数据驱动
前端·低代码