无代码开发方法、系统、设备及存储介质

技术领域

本公开涉及软件开发技术领域，尤其涉及一种无代码开发方法、系统、设备及存储介质。

背景技术

低代码(Low-Code)是一种快速设计和开发软件应用程序并且手动编码最少的方法。该方法可以为技术人员提供更快、更可靠的价值。通过在图形界面中使用可视化建模来组装和配置应用程序，开发人员可以跳过所有基础架构让开发速度提升起来。

相关技术中的无代码web开发方法通过上传设计稿文件，将设计稿文件解析成JSON数据，通过页面处理模块将JSON数据解析成页面，通过逻辑解析模块为页面上的组件加上业务逻辑，之后将整个页面提交给托管服务，以便访客访问。采用这种无代码的web开发方法，在web页面过多时会出现页面耦合度过高，JSON数据定义复杂且扩展性低，需要开发人员具有较高的逻辑梳理能力，并且具有设计稿与页面分离、无法覆盖页面功能需求的缺陷。

发明内容

有鉴于此，本公开实施例提供了一种无代码开发方法、系统、设备及存储介质，能够降低无代码开发的模块之间耦合性，组件灵活度高，且提高了数据的可扩展性，避免了设计稿与页面不统一的问题，可以覆盖页面的功能需求。

第一方面，本公开实施例提供了一种无代码开发方法，采用如下技术方案：

根据获取的业务需求端的业务需求信息，从组件数据库中获取多个目标组件；

将所述多个目标组件移动到画布上进行合并生成多个组件节点；

通过所述多个组件节点之间的业务逻辑，将所述多个组件节点进行连接；

添加所述多个组件节点之间的交互逻辑；

配置所述多个组件节点的菜单结构，并将所述菜单结构部署到服务器上。

在一些实施例中，将所述多个目标组件移动到画布上进行合并生成多个组件节点，包括：

将预设页面的视图进行拆分，直至所述视图无法拆分时得到若干个组件；

从所述若干个组件中筛选出多个目标组件；

将所述多个目标组件不断进行合并得到的新组件即为上级组件；

将所述上级组件作为所述组件节点。

在一些实施例中，通过所述多个组件节点之间的业务逻辑，将所述多个组件节点进行连接，包括：

获取每个所述组件节点暴露出的若干个API接口和事件；

从所述若干个对外接口和事件中选择作为源组件的第一组件节点的源事件和作为目的组件的第二组件节点的目的接口；

根据所选择的所述源事件和目的接口，将所述第一组件节点和所述第二组件节点进行连接。

在一些实施例中，添加所述多个组件节点之间的交互逻辑，包括以下至少之一：

当所述第一组件节点触发所述第二组件节点时，结束所述第一组件节点和所述第二组件节点之间的交互进程；

当所述第一组件节点触发所述第二组件节点时，将所述第一组件节点的当前状态更改为第一状态；

当所述第二组件节点进行回调处理后再触发所述第一组件节点时，将所述第一组件的当前状态更改为第二状态。

在一些实施例中，所述方法还包括：

在用户界面上传设计稿文件；

通过预设的视图算法解析所述设计稿文件，得到解析结果；

根据所述解析结果对所述设计稿文件进行切割，得到若干个设计稿碎片；

将所述若干个设计稿碎片与所述多个组件节点依次进行匹配，并在所述设计稿碎片所对应的当前区域中标记匹配成功的所述组件节点的ID信息；

当所述若干个设计稿碎片全部匹配完成后，根据标记的所述组件节点的ID信息和所述组件节点的配置信息之间的映射关系构建抽象节点数。

在一些实施例中，所述方法还包括：

根据前端代码将超文本标记语言HTML和层叠样式表CSS进行抽象处理，得到包含若干个组件的组件数据库；

将JavaScript文件抽象成所述若干个组件之间的连线；

暴露出所述若干个组件的API接口和事件。

第二方面，本公开实施例还提供了一种无代码开发装置，采用如下技术方案：

获取单元，被配置为根据获取的业务需求端的业务需求信息，从组件数据库中获取多个目标组件；

组件合并单元，被配置为将所述多个目标组件移动到画布上进行合并生成多个组件节点；

组件连接单元，被配置为通过所述多个组件节点之间的业务逻辑，将所述多个组件节点进行连接；

逻辑添加单元，被配置为添加所述多个组件节点之间的交互逻辑；

配置单元，被配置为配置所述多个组件节点的菜单结构，并将所述菜单结构部署到服务器上。

在一些实施例中，所述组件合并单元包括：

拆分模块，被配置为将预设页面的视图进行拆分，直至所述视图无法拆分时得到若干个组件；

筛选模块，被配置为从所述若干个组件中筛选出多个目标组件；

合并模块，被配置为将所述多个目标组件不断进行合并得到的新组件即为上级组件；

确定模块，被配置为将所述上级组件作为所述组件节点。

第三方面，本公开实施例还提供了一种电子设备，采用如下技术方案：

所述电子设备包括：

至少一个处理器；以及，

与所述至少一个处理器通信连接的存储器；其中，

所述存储器存储有可被所述至少一个处理器执行的指令，所述指令被所述至少一个处理器执行，以使所述至少一个处理器能够执行以上任一所述的无代码开发方法。

第四方面，本公开实施例还提供了一种计算机可读存储介质，该计算机可读存储介质存储计算机指令，该计算机指令用于使计算机执行以上任一所述的无代码开发方法。

本公开实施例提供的一种无代码开发方法、系统、设备及存储介质，通过根据获取的业务需求端的业务需求信息，从组件数据库中获取多个目标组件；将所述多个目标组件移动到画布上进行合并生成多个组件节点；通过所述多个组件节点之间的业务逻辑，将所述多个组件节点进行连接；添加所述多个组件节点之间的交互逻辑；配置所述多个组件节点的菜单结构，并将所述菜单结构部署到服务器上。本公开实施例能够降低无代码开发的模块之间耦合性，组件灵活度高，且提高了数据的可扩展性，避免了设计稿与页面不统一的问题，可以覆盖页面的功能需求。

上述说明仅是本公开技术方案的概述，为了能更清楚了解本公开的技术手段，而可依照说明书的内容予以实施，并且为让本公开的上述和其他目的、特征和优点能够更明显易懂，以下特举较佳实施例，并配合附图，详细说明如下。

附图说明

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

图1为本公开实施例提供的一种无代码开发方法的流程示意图；

图2为本公开实施例提供的一种无代码开发装置的结构示意图；

图3为本公开实施例提供的另一种无代码开发装置的结构示意图；

图4为本公开实施例提供的一种电子设备的原理框图。

具体实施方式

下面结合附图对本公开实施例进行详细描述。

应当明确，以下通过特定的具体实例说明本公开的实施方式，本领域技术人员可由本说明书所揭露的内容轻易地了解本公开的其他优点与功效。显然，所描述的实施例仅仅是本公开一部分实施例，而不是全部的实施例。本公开还可以通过另外不同的具体实施方式加以实施或应用，本说明书中的各项细节也可以基于不同观点与应用，在没有背离本公开的精神下进行各种修饰或改变。需说明的是，在不冲突的情况下，以下实施例及实施例中的特征可以相互组合。基于本公开中的实施例，本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例，都属于本公开保护的范围。

需要说明的是，下文描述在所附权利要求书的范围内的实施例的各种方面。应显而易见，本文中所描述的方面可体现于广泛多种形式中，且本文中所描述的任何特定结构及/或功能仅为说明性的。基于本公开，所属领域的技术人员应了解，本文中所描述的一个方面可与任何其它方面独立地实施，且可以各种方式组合这些方面中的两者或两者以上。举例来说，可使用本文中所阐述的任何数目各方面来实施设备及/或实践方法。另外，可使用除了本文中所阐述的方面中的一或多者之外的其它结构及/或功能性实施此设备及/或实践此方法。

还需要说明的是，以下实施例中所提供的图示仅以示意方式说明本公开的基本构想，图式中仅显示与本公开中有关的组件而非按照实际实施时的组件数目、形状及尺寸绘制，其实际实施时各组件的型态、数量及比例可为一种随意的改变，且其组件布局型态也可能更为复杂。

另外，在以下描述中，提供具体细节是为了便于透彻理解实例。然而，所属领域的技术人员将理解，可在没有这些特定细节的情况下实践所述方面。

如图1所示，本公开实施例提供了一种无代码开发方法，包括以下步骤：

S101、根据获取的业务需求端的业务需求信息，从组件数据库中获取多个目标组件。

S102、将多个目标组件移动到画布上进行合并生成多个组件节点。

可选地，在页面上描绘出用户所选择的多个目标组件，并将目标组件拖动到画布上，生成相应的组件节点。通过组件之间的嵌套进行布局设置，例如，可以在页面的右侧配置组件的属性信息，并在画布上对组件进行连线，生成业务逻辑。

S103、通过多个组件节点之间的业务逻辑，将多个组件节点进行连接。

S104、添加多个组件节点之间的交互逻辑。

S105、配置多个组件节点的菜单结构，并将菜单结构部署到服务器上。

本公开实施例能够降低无代码开发的模块之间耦合性，组件灵活度高，且提高了数据的可扩展性，避免了设计稿与页面不统一的问题，可以覆盖页面的功能需求。

可选地，在创建完组件节点及相关逻辑后就可以将生成的配置文件导出，其他业务需求端可以以该配置文件为标准，衍生自己的组件解析库。

可选地，针对组件节点的样式修改，可以抽象出一份配置文件生成UI示例区域，在UI示例区域中生成基础的样式配置，可以直接在页面上调试组件节点的配色，还可以在页面上进行主题切换。

在一些实施例中，上述步骤S102、将多个目标组件移动到画布上进行合并生成多个组件节点，包括：

将预设页面的视图进行拆分，直至视图无法拆分时得到若干个组件；

从若干个组件中筛选出多个目标组件；

将多个目标组件不断进行合并得到的新组件即为上级组件；

将上级组件作为组件节点。

可选地，页面是由组件组成的，通过相关算法将预设页面上的视图进行不断地拆分，例如，将预设页面上的一级视图进行拆分得到n个二级视图，将二级视图进行拆分得到n个三级视图，直到预设页面上的视图无法拆分时得到的即为最小的组件，再将这些拆分得到的组件进行合并生成一个新的上级组件，经过不断的将下级组件进行合并得到新的上级组件。

可选地，将组件抽象出多种状态，例如，包括基础状态和其他状态，其中，基础状态是组件在页面的最初表现形式，其他状态是指触发事件导致的当前组件的状态由基础状态进行更改后的状态。需要说明的是，用户可以根据实际需求来设置组件的状态，本公开实施例对此不做限定。

可选地，触发事件的来源可以包括以下两种：一、用户操作当前组件触发的事件；二、其他组件触发当前组件生成的事件。需要说明的是，用户可以根据实际需求来设置触发时间的来源，本公开实施例对此不做限定。

在一些实施例中，上述步骤S103、通过多个组件节点之间的业务逻辑，将多个组件节点进行连接，包括：

获取每个组件节点暴露出的若干个API接口和事件；

从若干个对外接口和事件中选择作为源组件的第一组件节点的源事件和作为目的组件的第二组件节点的目的接口；

根据所选择的源事件和目的接口，将第一组件节点和第二组件节点进行连接。

可选地，业务逻辑是指组件节点之间的交互，设置每个组件节点暴露出对外的API接口和事件，由于暴露出的事件和API接口是多个，因此需要选定源事件和目的接口，从而可以根据用户实际需求覆盖几乎所有的应用场景。

在一些实施例中，上述步骤S104、添加多个组件节点之间的交互逻辑，包括以下至少之一：

当第一组件节点触发第二组件节点时，结束第一组件节点和第二组件节点之间的交互进程；

当第一组件节点触发第二组件节点时，将第一组件节点的当前状态更改为第一状态；

当第二组件节点进行回调处理后再触发第一组件节点时，将第一组件的当前状态更改为第二状态。

可选地，例如A组件触发B组件，结束A组件和B组件之间的交互进程；A组件触发B组件，将A组件的当前状态更改为1；B组件进行回调处理后触发A组件，则将A组件的当前状态更改为2。

可选地，可以将上述交互逻辑抽象生成一个树，且生成的树是非闭环的。

在一些实施例中，该方法还包括：

在用户界面上传设计稿文件；

通过预设的视图算法解析设计稿文件，得到解析结果；

根据解析结果对设计稿文件进行切割，得到若干个设计稿碎片；

将若干个设计稿碎片与多个组件节点依次进行匹配，并在设计稿碎片所对应的当前区域中标记匹配成功的组件节点的ID信息；

当若干个设计稿碎片全部匹配完成后，根据标记的组件节点的ID信息和组件节点的配置信息之间的映射关系构建抽象节点数。

在一些实施例中，该方法还包括：

根据前端代码将超文本标记语言HTML和层叠样式表CSS进行抽象处理，得到包含若干个组件的组件数据库；

将JavaScript文件抽象成若干个组件之间的连线；

暴露出若干个组件的API接口和事件。

本公开实施例的无代码开发方法可以应用于数据展示界面及逻辑交互较简单的页面，在一个大型系统中需要开发新的功能模块时，通过无代码开发方法可以快速的实现功能，并可以将当前功能作为一个模块部署到大型系列中。

可选地，本公开实施例还可以将组件的交互逻辑抽象成Input和Output两种途径，以供组件的组合。

可选地，本公开实施例中的组件可以采用通用的Web Component，Web Component是Html5推出的一个新特征，即web组件。

可选地，本公开实施例以微前端的方式部署新的模块，以降低模块之间的耦合性，具有组件灵活度高、扩展性高，而且提高了数据的可扩展性，避免了设计稿与页面不统一的问题，可以覆盖页面的功能需求。

如图2所示，本公开实施例还提供了一种无代码开发装置，包括：

获取单元21，被配置为根据获取的业务需求端的业务需求信息，从组件数据库中获取多个目标组件；

组件合并单元22，被配置为将多个目标组件移动到画布上进行合并生成多个组件节点；

组件连接单元23，被配置为通过多个组件节点之间的业务逻辑，将多个组件节点进行连接；

逻辑添加单元24，被配置为添加多个组件节点之间的交互逻辑；

配置单元25，被配置为配置多个组件节点的菜单结构，并将菜单结构部署到服务器上。

如图3所示，在一些实施例中，组件合并单元22包括：

拆分模块31，被配置为将预设页面的视图进行拆分，直至视图无法拆分时得到若干个组件；

筛选模块32，被配置为从若干个组件中筛选出多个目标组件；

合并模块33，被配置为将多个目标组件不断进行合并得到的新组件即为上级组件；

确定模块34，被配置为将上级组件作为组件节点。

根据本公开实施例的电子设备包括存储器和处理器。该存储器用于存储非暂时性计算机可读指令。具体地，存储器可以包括一个或多个计算机程序产品，该计算机程序产品可以包括各种形式的计算机可读存储介质，例如易失性存储器和/或非易失性存储器。该易失性存储器例如可以包括随机存取存储器(RAM)和/或高速缓冲存储器(cache)等。该非易失性存储器例如可以包括只读存储器(ROM)、硬盘、闪存等。

该处理器可以是中央处理单元(CPU)或者具有数据处理能力和/或指令执行能力的其它形式的处理单元，并且可以控制电子设备中的其它组件以执行期望的功能。在本公开的一个实施例中，该处理器用于运行该存储器中存储的该计算机可读指令，使得该电子设备执行前述的本公开各实施例的无代码开发方法全部或部分步骤。

本领域技术人员应能理解，为了解决如何获得良好用户体验效果的技术问题，本实施例中也可以包括诸如通信总线、接口等公知的结构，这些公知的结构也应包含在本公开的保护范围之内。

如图4为本公开实施例提供的一种电子设备的结构示意图。其示出了适于用来实现本公开实施例中的电子设备的结构示意图。图4示出的电子设备仅仅是一个示例，不应对本公开实施例的功能和使用范围带来任何限制。

如图4所示，电子设备可以包括处理装置(例如中央处理器、图形处理器等)，其可以根据存储在只读存储器(ROM)中的程序或者从存储装置加载到随机访问存储器(RAM)中的程序而执行各种适当的动作和处理。在RAM中，还存储有电子设备操作所需的各种程序和数据。处理装置、ROM以及RAM通过总线彼此相连。输入/输出(I/O)接口也连接至总线。

通常，以下装置可以连接至I/O接口：包括例如传感器或者视觉信息采集设备等的输入装置；包括例如显示屏等的输出装置；包括例如磁带、硬盘等的存储装置；以及通信装置。通信装置可以允许电子设备与其他设备(比如边缘计算设备)进行无线或有线通信以交换数据。虽然图4示出了具有各种装置的电子设备，但是应理解的是，并不要求实施或具备所有示出的装置。可以替代地实施或具备更多或更少的装置。

特别地，根据本公开的实施例，上文参考流程图描述的过程可以被实现为计算机软件程序。例如，本公开的实施例包括一种计算机程序产品，其包括承载在非暂态计算机可读介质上的计算机程序，该计算机程序包含用于执行流程图所示的方法的程序代码。在这样的实施例中，该计算机程序可以通过通信装置从网络上被下载和安装，或者从存储装置被安装，或者从ROM被安装。在该计算机程序被处理装置执行时，执行本公开实施例的无代码开发方法的全部或部分步骤。

有关本实施例的详细说明可以参考前述各实施例中的相应说明，在此不再赘述。

根据本公开实施例的计算机可读存储介质，其上存储有非暂时性计算机可读指令。当该非暂时性计算机可读指令由处理器运行时，执行前述的本公开各实施例的无代码开发方法的全部或部分步骤。

上述计算机可读存储介质包括但不限于：光存储介质(例如：CD－ROM和DVD)、磁光存储介质(例如：MO)、磁存储介质(例如：磁带或移动硬盘)、具有内置的可重写非易失性存储器的媒体(例如：存储卡)和具有内置ROM的媒体(例如：ROM盒)。

有关本实施例的详细说明可以参考前述各实施例中的相应说明，在此不再赘述。

以上结合具体实施例描述了本公开的基本原理，但是，需要指出的是，在本公开中提及的优点、优势、效果等仅是示例而非限制，不能认为这些优点、优势、效果等是本公开的各个实施例必须具备的。另外，上述公开的具体细节仅是为了示例的作用和便于理解的作用，而非限制，上述细节并不限制本公开为必须采用上述具体的细节来实现。

在本公开中，诸如第一和第二等之类的关系术语仅仅用来将一个实体或者操作与另一个实体或操作区分开来，而不一定要求或者暗示这些实体或操作之间存在任何这种实际的关系或者顺序，本公开中涉及的器件、装置、设备、系统的方框图仅作为例示性的例子并且不意图要求或暗示必须按照方框图示出的方式进行连接、布置、配置。如本领域技术人员将认识到的，可以按任意方式连接、布置、配置这些器件、装置、设备、系统。诸如“包括”、“包含”、“具有”等等的词语是开放性词汇，指“包括但不限于”，且可与其互换使用。这里所使用的词汇“或”和“和”指词汇“和/或”，且可与其互换使用，除非上下文明确指示不是如此。这里所使用的词汇“诸如”指词组“诸如但不限于”，且可与其互换使用。

另外，如在此使用的，在以“至少一个”开始的项的列举中使用的“或”指示分离的列举，以便例如“A、B或C的至少一个”的列举意味着A或B或C，或AB或AC或BC，或ABC(即A和B和C)。此外，措辞“示例的”不意味着描述的例子是优选的或者比其他例子更好。

还需要指出的是，在本公开的系统和方法中，各部件或各步骤是可以分解和/或重新组合的。这些分解和/或重新组合应视为本公开的等效方案。

可以不脱离由所附权利要求定义的教导的技术而进行对在此的技术的各种改变、替换和更改。此外，本公开的权利要求的范围不限于以上所述的处理、机器、制造、事件的组成、手段、方法和动作的具体方面。可以利用与在此所述的相应方面进行基本相同的功能或者实现基本相同的结果的当前存在的或者稍后要开发的处理、机器、制造、事件的组成、手段、方法或动作。因而，所附权利要求包括在其范围内的这样的处理、机器、制造、事件的组成、手段、方法或动作。

提供所公开的方面的以上描述以使本领域的任何技术人员能够做出或者使用本公开。对这些方面的各种修改对于本领域技术人员而言是非常显而易见的，并且在此定义的一般原理可以应用于其他方面而不脱离本公开的范围。因此，本公开不意图被限制到在此示出的方面，而是按照与在此公开的原理和新颖的特征一致的最宽范围。

为了例示和描述的目的已经给出了以上描述。此外，此描述不意图将本公开的实施例限制到在此公开的形式。尽管以上已经讨论了多个示例方面和实施例，但是本领域技术人员将认识到其某些变型、修改、改变、添加和子组合。