CN112698826B - 低代码页面创建系统、方法及设备 - Google Patents

Abstract

本发明涉及一种低代码页面创建系统及方法，属于程序开发技术领域，可以面向开发人员，系统设置驱动模型、视图容器、动作容器和扩展容器；驱动模型，用于根据构建指令，创建对应的驱动模型，驱动模型包括视图模块和动作模块；视图容器，用于根据驱动模型的设置，对目标页面进行渲染；动作容器，用于根据驱动模型的设置，对动作进行页面展示及交互操作；扩展容器，用于根据扩展指令，对视图容器或动作容器进行扩展。本发明在低代码开发场景中，面向开发人员，提供了一种页面抽象的方法和系统，有效解决前端系统的冗余、重复部分，提高了开发人员的效率，提升低代码场景中前端开发的可扩展性。

Description

低代码页面创建系统、方法及设备

技术领域

本发明属于程序开发技术领域，具体涉及一种低代码页面创建系统、方法及设备。

背景技术

随着企业数字化、信息化市场规模的扩大，在“业务在线”需求与资本市场的关注双重作用下，低代码市场快速增长。基于低代码平台方式开发的信息化系统，特别是前端业务系统，越来越多。低代码系统由于其良好的模型抽象能力，前端能够获得更加底层、更加丰富的元数据信息；在一套前后端统一的通信协议基础之上，相较于传统web系统开发速度更快、成本更低、二次开发难度更简单。

目前，市面上低代码平台类产品在前端领域分为两种：一种是面向开发人员的独立前端库，通过补充配置信息，调用框架内的SDK生成页面；另一种面向非开发人员，常用在商城、博客等网站搭建上，提供丰富的样式变换选择，以及组件拖拽能力，通过非开发用户的自定义页面来完成系统搭建。

但是，面向开发人员的产品存在以下缺陷：代码与现代前端框架或者前端组件库非常耦合，开发者往往需要统一原有系统与该前端库的技术栈，不能自由选取想要的前端技术栈，或者作出妥协；配置未与现有后端系统做合理统一的前后端通信协议，由于用了第三方代码库，与现有后端系统必然存在适配的难度；前端组件的扩展能力不佳，用户总有现有系统满足不了的需求，如果使用第三方低代码前端库，会有扩展能力不足的问题。

发明内容

本发明提供了一种低代码页面创建系统、方法及设备，有效解决前端系统的冗余、重复部分，提高了开发人员的效率，提升低代码场景中前端开发的可扩展性。

本发明提供的技术方案如下：

一方面，一种低代码页面创建系统，包括：驱动模型、视图容器、动作容器和扩展容器；

所述驱动模型，用于根据构建指令，创建对应的驱动模型，所述驱动模型包括视图模块和动作模块；

所述视图容器，用于根据所述驱动模型的设置，对目标页面进行渲染；

所述动作容器，用于根据所述驱动模型的设置，对动作进行页面展示及交互操作；

所述扩展容器，用于根据扩展指令，对所述视图容器或所述动作容器进行扩展。

可选的，所述驱动模型，包括：视图模块和动作模块；

所述视图模块，用于根据视图设置指令，设置视图类型和视图配置信息；

所述动作模块，用于根据动作设置指令，设置视图动作的绑定类型和视图动作的视图类型；

所述视图容器，用于根据视图类型和视图配置，对页面进行渲染。

可选的，所述视图模块，包括视图配置单元和视图类型单元；

所述视图配置单元，用于根据视图配置指令，设置视图配置信息；

所述视图类型单元，用于根据视图类型设置指令，设置视图类型；

所述动作模块，包括：动作类型绑定单元和动作类型单元；

所述动作类型绑定单元，用于根据动作类型绑定指令，设置视图动作的绑定类型；

所述动作类型单元，用于根据动作视图类型设置指令，设置视图动作的类型。

可选的，所述视图类型单元，包括：表单页子单元、表格页子单元、详情页子单元；

所述动作类型单元，包括：服务器动作子单元、视图动作子单元、客户端动作子单元；

所述服务器动作子单元，用于对驱动模型进行增删查改操作，以及，在后端定义自定义的数据逻辑操作；

所述视图动作子单元，用于设置当前视图类型和目标视图类型；所述当前视图类型决定动作对应的视图容器，所述目标视图类型决定视图动作跳转的视图容器；

所述客户端动作子单元，用于执行前端设定的与页面交互的操作。

可选的，所述动作类型单元，包括动作基类；每个所述动作基类，包括：动作类型字段、动作名称字段、模型字段、视图绑定字段。

可选的，所述视图类型单元，包括：视图基类；每个所述视图基类，包括：视图类型字段、视图配置字段、模型字段、优先级字段。

可选的，所述视图容器与所述动作容器相关联；所述视图容器，根据所述动作容器的反馈，进行视图的展示；所述动作容器，根据所述视图容器的视图展示，进行视图动作的展示。

又一方面，一种低代码页面创建方法，其特征在于，应用上述任一所述的低代码页面创建系统，所述方法，包括：

根据构建指令，基于所述驱动模型，创建当前模型与目标模型；

在所述当前模型的基础上，基于所述视图模块，创建视图，设置视图类型和视图配置信息；

在所述当前模型的基础上，基于所述动作模块，创建视图动作，设置视图动作的绑定类型，设置视图动作的视图类型；

跳转至所述目标模型，在所述目标模型的基础上，基于所述视图模块，创建视图，设置视图类型和视图配置信息；

基于视图容器，对用户所到达的视图进行渲染；

基于所述动作容器，响应用户的交互，发送服务器动作请求或者跳转到一个新的视图容器。

可选的，还包括：

视图容器响应用户的交互，将事件发送给动作容器；

动作容器接收到视图容器的事件并进行响应，重新渲染动作列表。

又一方面，一种低代码页面创建设备，包括：处理器，以及与所述处理器相连接的存储器；

所述存储器用于存储计算机程序，所述计算机程序至少用于执行上述任一项所述的低代码页面创建方法；

所述处理器用于调用并执行所述存储器中的所述计算机程序。

本发明的有益效果为：

本发明实施例提供的低代码页面创建系统及方法，可以面向开发人员，系统设置驱动模型、视图容器、动作容器和扩展容器；驱动模型，用于根据构建指令，创建对应的驱动模型，驱动模型包括视图模块和动作模块；视图容器，用于根据驱动模型的设置，对目标页面进行渲染；动作容器，用于根据驱动模型的设置，对动作进行页面展示及交互操作；扩展容器，用于根据扩展指令，对视图容器或动作容器进行扩展。对于开发人员或者非开发人员，按照本申请的代码页面创建系统，能产出按照用户需求所定制的页面与效果。本发明在低代码开发场景中，面向开发人员，提供了一种页面抽象的方法和系统，有效解决前端系统的冗余、重复部分，提高了开发人员的效率，提升低代码场景中前端开发的可扩展性。

附图说明

为了更清楚地说明本发明实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本发明的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。

图1为本发明实施例提供的一种低代码页面创建系统的结构示意图；

图2为本发明实施例提供的一种低代码页面创建方法的流程示意图；

图3为本发明实施例提供的一种低代码页面创建设备的结构示意图。

附图标记：1-驱动模型；2-视图容器；3-动作容器；4-扩展容器；11-视图模块；12-动作模块；111-表单页子单元；112-表格页子单元；113-详情页子单元；121-服务器动作子单元；122-视图动作子单元；123-客户端动作子单元；41-视图扩展容器；42-动作扩展容器。

具体实施方式

为使本发明的目的、技术方案和优点更加清楚，下面将对本发明的技术方案进行详细的描述。显然，所描述的实施例仅仅是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有做出创造性劳动的前提下所得到的所有其它实施方式，都属于本发明所保护的范围。

为了至少解决本发明中提出的技术问题，本发明实施例提供一种低代码页面创建系统。

图1为本发明实施例提供的一种低代码页面创建系统的结构示意图，参阅图1，本发明实施例提供的系统，可以包括以下结构：驱动模型1、视图容器2、动作容器3和扩展容器4。其中，驱动模型1，用于根据构建指令，创建对应的驱动模型1，驱动模型1包括视图模块和动作模块。视图容器2，用于根据驱动模型1的设置，对目标页面进行渲染。动作容器3，用于根据驱动模型1的设置，对动作进行页面展示及交互操作。扩展容器4，用于根据扩展指令，对视图容器2或动作容器3进行扩展。

在一个具体的实现过程中，可以面向开发人员，从而应用本申请实施例提供的低代码页面创建系统。

例如，驱动模型可以包括抽象概念的视图、动作。

其中，视图容器2作为视图抽象的承载，根据视图配置和视图类型，对页面进行渲染；在表单子视图中，视图容器不仅对表单进行渲染，还拥有基本的数据联动、数据校验、数据回填功能。

其中，扩展容器4，可以包括：视图扩展容器41和动作扩展容器42。视图扩展容器：为了满足用户对自定义视图的特殊定制需求，可对视图容器没有覆盖到的内容进行补充，它需要程序开发人员进行开发，是一种特殊视图的补充。

在一些实施例中，可选的，驱动模型1，包括：视图模块11和动作模块12。其中，视图模块11，用于根据视图设置指令，设置视图类型和视图配置信息；动作模块12，用于根据动作设置指令，设置视图动作的绑定类型和视图动作的视图类型；视图容器2，用于根据视图类型和视图配置，对页面进行渲染。

在一些实施例中，可选的，视图模块11，包括视图配置单元和视图类型单元。视图配置单元，用于根据视图配置指令，设置视图配置信息；视图类型单元，用于根据视图类型设置指令，设置视图类型；动作模块，包括：动作类型绑定单元和动作类型单元；动作类型绑定单元，用于根据动作类型绑定指令，设置视图动作的绑定类型；动作类型单元，用于根据动作视图类型设置指令，设置视图动作的类型。

例如，在本实施例中，视图配置单元可以根据页面的自定义需求而进行修改，从而满足用户的不同需求。

在一些实施例中，可选的，视图类型单元，包括：表单页子单元111、表格页子单元112、详情页子单元113。动作类型单元，包括：服务器动作子单元121、视图动作子单元122、客户端动作子单元123。服务器动作子单元，用于对驱动模型1进行增删查改操作，以及，在后端定义自定义的数据逻辑操作。视图动作子单元122，用于设置当前视图类型和目标视图类型；当前视图类型决定动作对应的视图容器2，目标视图类型决定视图动作跳转的视图容器2.客户端动作子单元123，用于执行前端设定的与页面交互的操作。

例如，服务器动作子单元：能对模型进行基本的增删查改操作，也可以在后端定义自定义的数据逻辑操作。视图动作子单元：包括当前视图类型、目标视图类型；当前视图类型决定了一个动作所处的视图容器，目标视图类型决定了视图动作所跳转的视图容器。客户端动作子单元，前端默认的一些与页面交互相关的操作，包括了页面刷新、关闭弹窗、表单前端校验。

开发人员对动作进行定义后，动作容器将视图类型进行筛选并展示在页面中。其中，为了满足用户对自定义动作的特殊定制需求，可对动作容器没有覆盖到的内容进行补充，开发人员可根据扩展规范编写按需求定制的动作函数与动作交互容器。

在一些实施例中，可选的，动作类型单元，包括动作基类；每个动作基类，包括：动作类型字段、动作名称字段、模型字段、视图绑定字段。

在一些实施例中，可选的，视图类型单元，包括：视图基类；每个视图基类，包括：视图类型字段、视图配置字段、模型字段、优先级字段。

在一些实施例中，可选的，视图容器2与动作容器3相关联；视图容器2，根据动作容器3的反馈，进行视图的展示；动作容器3，根据视图容器2的视图展示，进行视图动作的展示。

例如，视图抽象，实现方案包括：一个视图基类，包括视图类型字段（枚举类型）、视图配置字段（string类型）、模型字段（string类型）、优先级字段（number类型）。

例如，动作抽象概念，包括三种动作类型：服务器动作、视图动作、客户端动作；定义类和数据库表作为抽象概念的承载他们分别包括：动作基类，包括动作类型字段（枚举）、动作名称字段（string类型）、模型字段（string类型）、视图绑定字段（string类型）。

服务器动作类，继承自动作基类，包括函数字段（多对一类型）；视图动作类，继承自动作基类，包括视图类型字段（string类型）；客户端动作类，在前端定义，包括刷新页面、关闭弹窗、前端表单校验等用户交互操作。

其中，动作容器：作为动作抽象的承载，上述的三种动作，对其进行页面展示及交互操作；动作扩展容器：为了满足用户对自定义动作的特殊定制需求，可对动作容器没有覆盖到的内容进行补充，开发人员可根据扩展规范编写按需求定制的动作函数与动作交互容器。

例如，视图动作可以决定视图容器的展示，视图的展示又可反过来决定动作容器的展示，在视图动作和视图容器之间设置通信机制，该通信机制使得视图动作和视图容器能够互相通信。

本发明实施例提供的低代码页面创建系统，可以面向开发人员，系统设置驱动模型、视图容器、动作容器和扩展容器；驱动模型，用于根据构建指令，创建对应的驱动模型，驱动模型包括视图模块和动作模块；视图容器，用于根据驱动模型的设置，对目标页面进行渲染；动作容器，用于根据驱动模型的设置，对动作进行页面展示及交互操作；扩展容器，用于根据扩展指令，对视图容器或动作容器进行扩展。对于开发人员或者非开发人员，按照本申请的代码页面创建系统，能产出按照用户需求所定制的页面与效果。

相对于现有技术的特点，本发明具有如下优点：

对于低代码开发而言，本发明从配置和抽象角度，为低代码的页面抽象模式和页面开发提出一种新的抽象方法；

前端开发在固定场景与交互下，在一定抽象基础之上，能够节省开发人力，提高开发效率，本发明不仅对低代码的页面系统做了指导工作，同时也可以应用于普通web系统中；

通过配置与抽象模式生成的页面，在配置正确的情况下，其错误率极低，不用开发人员额外调试或者二次开发；

基于模型驱动，前端能拿到更多的元数据信息，这样不依赖于后端接口，并且省掉了更多的重复，繁琐的开发工作。

基于一个总的发明构思，本发明实施例还提供一种低代码页面创建方法。

图2为本发明实施例提供的一种低代码页面创建方法的流程示意图，如图2所示，本发明实施例提供的方法，可以包括以下步骤：

S21、根据构建指令，基于驱动模型，创建当前模型与目标模型；

S22、在当前模型的基础上，基于视图模块，创建视图，设置视图类型和视图配置信息；

S23、在当前模型的基础上，基于动作模块，创建视图动作，设置视图动作的绑定类型，设置视图动作的视图类型；

S24、跳转至目标模型，在目标模型的基础上，基于视图模块，创建视图，设置视图类型和视图配置信息；

S25、基于视图容器，对用户所到达的视图进行渲染；

S26、基于动作容器，响应用户的交互，发送服务器动作请求或者跳转到一个新的视图容器。

在一些实施例中，可选的，还包括以下步骤：

S27、视图容器响应用户的交互，将事件发送给动作容器。

S28、动作容器接收到视图容器的事件并进行响应，重新渲染动作列表。

关于上述实施例中的方法，其中各个步骤执行操作的具体方式已经在有关该系统的实施例中进行了详细描述，此处将不做详细阐述说明。

基于一个总的发明构思，本发明实施例还提供一种低代码页面创建设备。

图3为本发明实施例提供的一种低代码页面创建设备结构示意图，请参阅图3，本发明实施例提供的一种低代码页面创建设备，包括：处理器31，以及与处理器相连接的存储器32。

存储器32用于存储计算机程序，计算机程序至少用于上述任一实施例记载的低代码页面创建方法；

处理器31用于调用并执行存储器中的计算机程序。

以上所述，仅为本发明的具体实施方式，但本发明的保护范围并不局限于此，任何熟悉本技术领域的技术人员在本发明揭露的技术范围内，可轻易想到变化或替换，都应涵盖在本发明的保护范围之内。因此，本发明的保护范围应以所述权利要求的保护范围为准。

可以理解的是，上述各实施例中相同或相似部分可以相互参考，在一些实施例中未详细说明的内容可以参见其他实施例中相同或相似的内容。

需要说明的是，在本发明的描述中，术语“第一”、“第二”等仅用于描述目的，而不能理解为指示或暗示相对重要性。此外，在本发明的描述中，除非另有说明，“多个”的含义是指至少两个。

流程图中或在此以其他方式描述的任何过程或方法描述可以被理解为，表示包括一个或更多个用于实现特定逻辑功能或过程的步骤的可执行指令的代码的模块、片段或部分，并且本发明的优选实施方式的范围包括另外的实现，其中可以不按所示出或讨论的顺序，包括根据所涉及的功能按基本同时的方式或按相反的顺序，来执行功能，这应被本发明的实施例所属技术领域的技术人员所理解。

应当理解，本发明的各部分可以用硬件、软件、固件或它们的组合来实现。在上述实施方式中，多个步骤或方法可以用存储在存储器中且由合适的指令执行系统执行的软件或固件来实现。例如，如果用硬件来实现，和在另一实施方式中一样，可用本领域公知的下列技术中的任一项或他们的组合来实现：具有用于对数据信号实现逻辑功能的逻辑门电路的离散逻辑电路，具有合适的组合逻辑门电路的专用集成电路，可编程门阵列（PGA），现场可编程门阵列（FPGA）等。

本技术领域的普通技术人员可以理解实现上述实施例方法携带的全部或部分步骤是可以通过程序来指令相关的硬件完成，所述的程序可以存储于一种计算机可读存储介质中，该程序在执行时，包括方法实施例的步骤之一或其组合。

此外，在本发明各个实施例中的各功能单元可以集成在一个处理模块中，也可以是各个单元单独物理存在，也可以两个或两个以上单元集成在一个模块中。上述集成的模块既可以采用硬件的形式实现，也可以采用软件功能模块的形式实现。所述集成的模块如果以软件功能模块的形式实现并作为独立的产品销售或使用时，也可以存储在一个计算机可读取存储介质中。

上述提到的存储介质可以是只读存储器，磁盘或光盘等。

在本说明书的描述中，参考术语“一个实施例”、“一些实施例”、“示例”、“具体示例”、或“一些示例”等的描述意指结合该实施例或示例描述的具体特征、结构、材料或者特点包含于本发明的至少一个实施例或示例中。在本说明书中，对上述术语的示意性表述不一定指的是相同的实施例或示例。而且，描述的具体特征、结构、材料或者特点可以在任何的一个或多个实施例或示例中以合适的方式结合。

尽管上面已经示出和描述了本发明的实施例，可以理解的是，上述实施例是示例性的，不能理解为对本发明的限制，本领域的普通技术人员在本发明的范围内可以对上述实施例进行变化、修改、替换和变型。

Claims (9)

1.一种低代码页面创建系统，其特征在于，包括：驱动模型、视图容器、动作容器和扩展容器；

所述驱动模型，用于根据构建指令，创建对应的驱动模型，所述驱动模型包括视图模块和动作模块；所述驱动模型，包括：视图模块和动作模块；所述视图模块，用于根据视图设置指令，设置视图类型和视图配置信息；所述动作模块，用于根据动作设置指令，设置视图动作的绑定类型和视图动作的视图类型；所述视图容器，用于根据视图类型和视图配置，对页面进行渲染；

所述视图容器，用于根据所述驱动模型的设置，对目标页面进行渲染；

所述动作容器，用于根据所述驱动模型的设置，对动作进行页面展示及交互操作；

所述扩展容器，用于根据扩展指令，对所述视图容器或所述动作容器进行扩展。

2.根据权利要求1所述的系统，其特征在于，所述视图模块，包括视图配置单元和视图类型单元；

所述视图配置单元，用于根据视图配置指令，设置视图配置信息；

所述视图类型单元，用于根据视图类型设置指令，设置视图类型；

所述动作模块，包括：动作类型绑定单元和动作类型单元；

所述动作类型绑定单元，用于根据动作类型绑定指令，设置视图动作的绑定类型；

所述动作类型单元，用于根据动作视图类型设置指令，设置视图动作的类型。

3.根据权利要求2所述的系统，其特征在于，所述视图类型单元，包括：表单页子单元、表格页子单元、详情页子单元；

所述动作类型单元，包括：服务器动作子单元、视图动作子单元、客户端动作子单元；

所述服务器动作子单元，用于对驱动模型进行增删查改操作，以及，在后端定义自定义的数据逻辑操作；

所述视图动作子单元，用于设置当前视图类型和目标视图类型；所述当前视图类型决定动作对应的视图容器，所述目标视图类型决定视图动作跳转的视图容器；

所述客户端动作子单元，用于执行前端设定的与页面交互的操作。

4.根据权利要求3所述的系统，其特征在于，所述动作类型单元，包括动作基类；每个所述动作基类，包括：动作类型字段、动作名称字段、模型字段、视图绑定字段。

5.根据权利要求3所述的系统，其特征在于，所述视图类型单元，包括：视图基类；每个所述视图基类，包括：视图类型字段、视图配置字段、模型字段、优先级字段。

6.根据权利要求1所述的系统，其特征在于，所述视图容器与所述动作容器相关联；所述视图容器，根据所述动作容器的反馈，进行视图的展示；所述动作容器，根据所述视图容器的视图展示，进行视图动作的展示。

7.一种低代码页面创建方法，其特征在于，应用于权利要求1-6任一所述的低代码页面创建系统，所述方法，包括：

根据构建指令，基于所述驱动模型，创建当前模型与目标模型；

在所述当前模型的基础上，基于所述视图模块，创建视图，设置视图类型和视图配置信息；

在所述当前模型的基础上，基于所述动作模块，创建视图动作，设置视图动作的绑定类型，设置视图动作的视图类型；

跳转至所述目标模型，在所述目标模型的基础上，基于所述视图模块，创建视图，设置视图类型和视图配置信息；

基于视图容器，对用户所到达的视图进行渲染；

基于所述动作容器，响应用户的交互，发送服务器动作请求或者跳转到一个新的视图容器。

8.根据权利要求7所述的方法，其特征在于，还包括：

视图容器响应用户的交互，将事件发送给动作容器；

动作容器接收到视图容器的事件并进行响应，重新渲染动作列表。

9.一种低代码页面创建设备，其特征在于，包括：处理器，以及与所述处理器相连接的存储器；

所述存储器用于存储计算机程序，所述计算机程序至少用于执行权利要求7~8任一项所述的低代码页面创建方法；

所述处理器用于调用并执行所述存储器中的所述计算机程序。

Images