“从零开始理解低代码中的表单、列表和数据模型

基础介绍

表单是低代码中最基础的业务配置引擎之一，它主要负责与人和系统之间的交互操作，弄清楚数据输入、数据存储，数据展示是快速配置应用的基础和前提，那么我们需要理解表单、列表、数据模型之间的关系。我们先来看一个最简单的场景：一个最简单的学生管理功能，我们从示例中去理解三者之间的关系，先看下图：

如上图所示，展示了一个最简单的表单（作为数据输入），最简单的列表页（数据展示）的demo，那么他们的数据存储位置在哪里呢，如下图所示：

列表页和表单设计界面中都有模型的界面入口，只是这里的模型不需要人为去设置，系统可以自动生成。

三者之间关联关系

接下来我们看下表单、列表、模型之间的关系，如下图所示：

• 表单：通过配置哪些组件，实现用户数据录入的页面
• 模型：是由系统自动生成的，用于系统存放通过表单录入进来的数据
• 列表：把模型中的数据通过列表的形式展示出来

这个简单的模型中看出来，表单、列表与模型是分工不同的事情，在JVS系统中，分别对应表单引擎、列表引擎、动态模型三个不同的能力基础引擎。

模型的动态构建

JVS的应用快速开发和普通的低代码平台之间，有很多优势特点，其中最亮眼的有两个特点：“动态自动化构建模型”与“即使用即设计的理念”，这里重点讲解下动态构建，关于即使用即设计可以参考其他章节。

动态自动化构建模型是在业务开发的过程中高效、标准化交付的利器，采用所见即所得的配置思路，快速的通过表单、列表页的配置，点击保存时，系统会自动判断底层数据是否需要调整，如果需要调整，系统自动创建/调整对应的数据模型，后续的环节直接使用对应的模型（绑定对应字段）即可。那么我们可以举两个场景来看看。

场景一：列表页新增字段，表单直接绑定该字段，并实现数据入库：

我们先来看下具体的效果，如下图所示：

①：进入列表页配置器，在列表页展示数据中新增字段

②：保存后，数据模型中自动创建相应字段

③：进入列表页对应新增按钮出发的新增表单（会使用相同的数据模型），查看模型

④：新增一个组件，绑定新的字段，保存

⑤：刷新列表页，看到最后配置效果，通过表单新的字段录入信息后，在列表页中实现数据的展示

场景二：在表单中新增加字段，在列表中绑定增加字段，并实现数据入库

我们还是先看看配置效果，如下图所示：

①：进入表单中

②：新增一个组件，无需绑定数据模型，直接修改组件名称，点击保存后系统自动会对模型新增字段

③：进入列表页，在数据模型中可以看到新增字段，在列表页展示数据中，把对应字段增加展示

*********************************

开源框架：https://gitee.com/software-minister/jvs