CN116661768B - 基于知识图谱的页面代码生成方法、系统、装置和介质 - Google Patents

Abstract

本发明公开了一种基于知识图谱的页面代码生成方法、系统、装置和介质，方法包括建立组件知识图谱；建立页面组件与代码段之间的第一映射关系，以及组件属性与代码段之间的第二映射关系，并补充到组件知识图谱中，得到更新组件知识图谱；基于所有第一关系、第二关系和第三关系，构建所有页面组件之间的组件关系链模型；基于更新组件知识图谱和组件关系链模型，生成组件关系链模型中每个元素对应的关系链代码段；并根据所有关系链代码段，得到目标页面的目标代码。本发明实现了基础知识库和程序之间的松耦合，既提高了页面代码生成的效率，也提高了当组件增加或修改时的易扩展性，生成的代码质量高、冗余少、可读性强并易于扩展。

Description

基于知识图谱的页面代码生成方法、系统、装置和介质

技术领域

本发明涉及页面代码生成领域，具体涉及一种基于知识图谱的页面代码生成方法、系统、装置和介质。

背景技术

软件的页面代码以往是通过编程人员手动编写的，这种方式耗时长且代码质量得不到保障。在低代码和无代码开发方式兴起后，大量的应用软件通过在低代码或无代码开发平台中，采用拖拉拽的方式被搭建并部署运行，这类低代码或无代码开发平台包括了常见的页面组件，还支持组件之间的组合应用，这种方式能快速搭建软件页面，节省了代码的编写时间。

在面对需要进行应用软件导出并独立部署运行的场景时，低代码或无代码开发平台的代码自动生成能力至关重要。在代码生成过程中，应尽量不产生冗余代码，且符合编程人员的编码习惯，以保障代码的易读性。

然而，目前在低代码或无代码开发平台，通过拖拽和配置的方式实现页面代码的部署，生成的代码质量较差、冗余多且易读性较差，无法满足目前的应用软件导出并独立部署运行的场景的要求。

发明内容

有鉴于此，本发明提供了一种基于知识图谱的页面代码生成方法、系统、装置和介质，在低代码或无代码开发平台通过拖拽和配置的方式实现的页面中，直接生成和导出页面代码，且生成的页面代码质量高、冗余少、可读性强并易于扩展。

本发明提供了一种基于知识图谱的页面代码生成方法，包括：

建立目标页面的组件知识图谱；其中，所述目标页面包括多个页面组件；对于每个所述页面组件，所述组件知识图谱中包括所述页面组件与组件属性之间的第一关系、属性分类与所述组件属性之间的第二关系以及所述页面组件与其余所述页面组件之间的第三关系；

对于每个所述页面组件，建立所述页面组件与代码段之间的第一映射关系，以及所述组件属性与代码段之间的第二映射关系，将所述第一映射关系和所述第二映射关系补充到所述组件知识图谱中，得到更新组件知识图谱；

基于所有所述第一关系、所有所述第二关系和所有所述第三关系，构建所有所述页面组件之间的组件关系链模型；

基于所述更新组件知识图谱和所述组件关系链模型，生成所述组件关系链模型中每个元素对应的关系链代码段；并根据所有所述关系链代码段，得到所述目标页面的目标代码。

可选地，所述属性分类包括基础属性、位置属性、外观属性、原生属性、样式属性、表单属性、图表属性和扩展属性。

可选地，所述页面组件与所述组件属性之间的第一关系具体表现为包含属性或不包含属性；

所述属性分类与所述组件属性之间的第二关系具体表现为包含属性或不包含属性；

所述页面组件与其余所述页面组件之间的第三关系具体表现为可嵌套或不可嵌套。

可选地，所述页面组件与代码段之间的所述第一映射关系具体为框架表达关系；

所述组件属性与代码段之间的所述第二映射关系具体为代码表达关系。

可选地，所述页面组件包括容器组件和非容器组件；

当所述页面组件为容器组件时，所述页面组件与代码段之间对应的所述框架表达关系式具体为“<容器组件名 ******>#####<容器组件名/>”；

当所述页面组件为非容器组件时，所述页面组件与代码段之间对应的所述框架表达关系式具体为“<组件名 ******/>”；

其中，“******”和“#####”均为标识符，作为在自动生成代码过程中进行替换的位置标识。

可选地，所述基于所有所述第一关系、所有所述第二关系和所有所述第三关系，构建所有所述页面组件之间的组件关系链模型，包括：

基于所有所述第一关系、所有所述第二关系和所有所述第三关系，为每个所述页面组件增加上级组件属性，并为增加的所述上级组件属性赋予对应的上级组件属性值；

基于增加的所述上级组件属性以及对应的所述上级组件属性值，按照父-子关系，对所有所述页面组件进行检索，得到所有所述页面组件之间的所述组件关系链模型；

所述组件关系链模型的表达式为：L={L1，L2，L3，......，Ln}；

其中，L为所述组件关系链模型对应的集合，n为所述页面组件增加的所述上级组件属性为空的组件总数；任意Lx∈L表示一条从根节点的页面组件到叶子节点的组件顺序集合，x为任意正整数，且x≤n。

可选地，所述基于所述更新组件知识图谱和所述组件关系链模型，生成所述组件关系链模型中每个元素对应的关系链代码段；并根据所有所述关系链代码段，得到所述目标页面的目标代码，包括：

基于所述更新组件知识图谱，生成每个所述页面组件对应的组件属性集合代码；

选取所述组件关系链模型中任一个所述组件顺序集合Lx，按照生成所述组件属性集合代码同样的方法，生成选取的所述组件顺序集合Lx的组件集合代码；

根据选取的所述组件顺序集合Lx的所述组件集合代码以及所述组件顺序集合Lx中每个所述页面组件对应的所述组件属性集合代码，对选取的所述组件顺序集合Lx中所有所述页面组件进行父子组合嵌套，生成选取的所述组件顺序集合Lx对应的组合嵌套代码；

根据选取的所述组件顺序集合Lx的所述组件集合代码和所述组合嵌套代码，得到所述组件关系链模型中选取的所述组件顺序集合Lx对应的所述关系链代码段；

遍历所述组件关系链模型中的每个所述组件顺序集合，得到所述组件关系链模型中每个元素对应的所述关系链代码段；

对所述组件关系链模型中所有元素的所述关系链代码段进行顺序组合，得到所述目标页面的所述目标代码。

此外，本发明还提供了一种基于知识图谱的页面代码生成系统，应用于前述的基于知识图谱的页面代码生成方法中，包括：

知识图谱构建模块，用于建立目标页面的组件知识图谱；其中，所述目标页面包括多个页面组件；对于每个所述页面组件，所述组件知识图谱中包括所述页面组件与组件属性之间的第一关系、属性分类与所述组件属性之间的第二关系以及所述页面组件与其余所述页面组件之间的第三关系；

映射关系获取模块，用于对于每个所述页面组件，建立所述页面组件与代码段之间的第一映射关系，以及所述组件属性与代码段之间的第二映射关系，将所述第一映射关系和所述第二映射关系补充到所述组件知识图谱中，得到更新组件知识图谱；

组件关系链构建模块，用于基于所有所述第一关系、所有所述第二关系和所有所述第三关系，构建所有所述页面组件之间的组件关系链模型；

代码生成模块，用于基于所述更新组件知识图谱和所述组件关系链模型，生成所述组件关系链模型中每个元素对应的关系链代码段；并根据所有所述关系链代码段，得到所述目标页面的目标代码。

此外，本发明还提供一种基于知识图谱的页面代码生成装置，其特征在于，包括处理器、存储器和存储在所述存储器中且可运行在所述处理器上的计算机程序，所述计算机程序运行时实现前述的基于知识图谱的页面代码生成方法中的方法步骤。

此外，本发明还提供一种计算机存储介质，其特征在于，所述计算机存储介质包括：至少一个指令，在所述指令被执行时实现前述的基于知识图谱的页面代码生成方法中的方法步骤。

本发明的有益效果：采用知识图谱的方法，对页面组件、属性分类、组件属性等之间的关系，以及页面组件和组件属性的代码表达进行了统一管理，实现了基础知识库和程序之间的松耦合，既提高了页面代码生成的效率，也提高了当组件增加或修改时的易扩展性。在低代码或无代码环境中通过拖拽和配置的方式实现的页面，可以直接采用本方法进行代码生成和导出，生成的代码质量高、冗余少、可读性强并易于扩展。

附图说明

通过参考附图会更加清楚的理解本发明的特征和优点，附图是示意性的而不应理解为对本发明进行任何限制，在附图中：

图1示出了本发明实施例一中一种基于知识图谱的页面代码生成方法的流程图；

图2示出了本发明实施例一中页面组件、属性分类、组件属性和组件属性所赋予的属性值之间的组件知识图谱的模型图；

图3示出了本发明实施例一中构建组件关系链的流程图；

图4示出了本发明实施例一中生成组件属性集合代码的流程图；

图5示出了本发明实施例二中一种基于知识图谱的页面代码生成系统的结构图。

具体实施方式

为使本发明实施例的目的、技术方案和优点更加清楚，下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域技术人员在没有作出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。

实施例一

如图1所示，一种基于知识图谱的页面代码生成方法，该方法包括：

S1：建立目标页面的组件知识图谱；其中，所述目标页面包括多个页面组件；对于每个所述页面组件，所述组件知识图谱中包括所述页面组件与组件属性之间的第一关系、属性分类与所述组件属性之间的第二关系以及所述页面组件与其余所述页面组件之间的第三关系。

通过上述包含有第一关系、第二关系和第三关系的组件知识图谱，一方面实现了对页面组件相关数据信息的统一管理，实现了基础知识库和程序之间的松耦合；另一方面便于后续基于该组件知识图谱，来自动生成目标页面的代码，提高了页面代码生成的效率。

本实施例中，组件分为容器类组件和非容器类组件，非容器类组件也称普通组件，普通组件可嵌套到容器类组件中使用，是页面可视化和交互时的主要对象。

本实施例中，所述属性分类包括基础属性、位置属性、外观属性、原生属性、样式属性、表单属性、图表属性和扩展属性。

本实施例中，所述页面组件与所述组件属性之间的第一关系具体表现为包含属性或不包含属性；

所述属性分类与所述组件属性之间的第二关系具体表现为包含属性或不包含属性；

所述页面组件与其余所述页面组件之间的第三关系具体表现为可嵌套或不可嵌套。

对于第一关系，当为“包含属性”时，还可细分为“可为空”或“不可为空”，当“不可为空”时，需要设定“默认值”关系。当页面组件与组件属性间存在“默认值”关系时，可隐藏其对应的“包含属性”关系。

同一属性在不同的组件环境下，值类型和约束可能不一致，因此，页面组件和组件属性之间存在“约束关系”，为使页面组件和组件属性在知识图谱中表现为节点与节点之间的唯一关系，将知识图谱中的关系进行化简，若页面组件和组件属性之间存在“包含属性”关系，在节点之间表现为“约束关系”；若存在“不包含属性”属性，则页面组件和组件属性在节点之间不存在连接线。为不同的页面组件对应的组件属性赋予值类型和要求，页面组件、属性分类、组件属性和组件属性所赋予的属性值之间的知识图谱如图2所示。

如图1所示，该方法包括：

S2：对于每个所述页面组件，建立所述页面组件与代码段之间的第一映射关系，以及所述组件属性与代码段之间的第二映射关系，将所述第一映射关系和所述第二映射关系补充到所述组件知识图谱中，得到更新组件知识图谱。

通过建立的页面组件与代码段之间的第一映射关系，以及组件属性与代码段之间的第二映射关系，来对组件知识图谱进行补充和更新，一方面完善了知识图谱，便于提高后续生成的代码精度；另一方面还能确保后续基于该更新组件知识图谱来自动生成页面组件和组件属性相关的代码，进而得到目标页面所对应的目标代码。

在本实施例中，所述页面组件与代码段之间的所述第一映射关系具体为框架表达关系；

所述组件属性与代码段之间的所述第二映射关系具体为代码表达关系。

具体地，所述页面组件包括容器组件和非容器组件；

当所述页面组件为容器组件时，所述页面组件与代码段之间对应的所述框架表达关系式具体为“<容器组件名 ******>#####<容器组件名/>”；

当所述页面组件为非容器组件时，所述页面组件与代码段之间对应的所述框架表达关系式具体为“<组件名 ******/>”；

其中，“******”和“#####”均为标识符，作为在自动生成代码过程中进行替换的位置标识。

如图1所示，该方法包括：

S3：基于所有所述第一关系、所有所述第二关系和所有所述第三关系，构建所有所述页面组件之间的组件关系链模型。

S3包括：

S31：基于所有所述第一关系、所有所述第二关系和所有所述第三关系，为每个所述页面组件增加上级组件属性，并为增加的所述上级组件属性赋予对应的上级组件属性值；

S32：基于增加的所述上级组件属性以及对应的所述上级组件属性值，按照父-子关系，对所有所述页面组件进行检索，得到所有所述页面组件之间的所述组件关系链模型；

所述组件关系链模型的表达式为：L={L1，L2，L3，......，Ln}；

其中，L为所述组件关系链模型对应的集合，n为所述页面组件增加的所述上级组件属性为空的组件总数；任意Lx∈L表示一条从根节点的页面组件到叶子节点的页面组件的组件顺序集合，x为任意正整数，且x≤n。

上述步骤形成的组件关系链模型，充分反映了页面组件之间的关系，进而便于后续将关系链代码进行顺序组合，形成最终的目标代码。

具体地，假定页面中的组件集合为C={C1，C2，C3，......，Cm}，组件之间的关系链集合为L={L1，L2，L3，......，Ln}，其中，n为所有“上级组件”属性为空的组件总数。对组件树进行深度优先遍历，如图3所示，设x1，y1，z1为任意正整数，且x1≤m，Cx1∈C，y1≥1，z1≥1。

（1）令x1=1，n=0，Cx1=C1；

（2）若Cx1的上级组件属性不为空，转到（3）；否则令n=n+1，Ln=Ln∪{Cx1}；

（3）若x1<m，x1=x1+1；转到（2）；

（4）令z1=1，Ly1=L1，CL=C-L1-L2-L3-...-Ln；

（5）若CL不为空，CLz1=CL1；否则，转到（10）；

（6）遍历L的所有子集，寻找CLz1的上级组件所在集合Ly1；

（7）若Ly1存在，Ly1=Ln∪{CLz1}，转到（8）；若Ly1不存在，z1=z1+1，转到（6）；

（8）CL=CL-CLz1，若z1≤|CL|，转到（6），否则转到（9）；

（9）若CL不为空，转到（5）；

（10）结束。

至此，完成目标页面中所有页面组件的关系链构建过程，并按父-子关系顺序存储于组件关系链模型Ln中。

如图1所示，该方法包括：

S4：基于所述更新组件知识图谱和所述组件关系链模型，生成所述组件关系链模型中每个元素对应的关系链代码段；并根据所有所述关系链代码段，得到所述目标页面的目标代码。

S4包括：

S41：基于所述更新组件知识图谱，生成每个所述页面组件对应的组件属性集合代码；

S42：选取所述组件关系链模型中任一个所述组件顺序集合Lx，按照生成所述组件属性集合代码同样的方法，生成选取的所述组件顺序集合Lx的组件集合代码；

S43：根据选取的所述组件顺序集合Lx的所述组件集合代码以及所述组件顺序集合Lx中每个所述页面组件对应的所述组件属性集合代码，对选取的所述组件顺序集合Lx中所有所述页面组件进行父子组合嵌套，生成选取的所述组件顺序集合Lx对应的组合嵌套代码；

S44：根据选取的所述组件顺序集合Lx的所述组件集合代码和所述组合嵌套代码，得到所述组件关系链模型中选取的所述组件顺序集合Lx对应的所述关系链代码段；

S45：遍历所述组件关系链模型中的每个所述组件顺序集合，得到所述组件关系链模型中每个元素对应的所述关系链代码段；

S46：对所述组件关系链模型中所有元素的所述关系链代码段进行顺序组合，得到所述目标页面的所述目标代码。

本实施例采用上述步骤形成目标代码，在低代码或无代码环境中无需通过拖拽和配置的方式实现页面组件代码的生成，可直接智能生成代码，提高了页面对象代码的实现效率并避免了手工编码可能产生的问题，且生成的代码质量高、冗余少、可读性强并易于扩展。

本实施例S41，在知识图谱中，页面组件与组件属性表示为“包含属性”关系，组件属性与代码段之间表示为“代码表达”关系，页面组件与组件属性在该组件下的默认值之间表示为“默认值”关系并标定默认值。

假设页面组件C的属性集合为A={A1，A2，A3，.......，Aa}。对任意正整数i，且i≤a，Ai∈A，Ai表示当前组件第i类属性的集合，Ai={ai1，ai2，ai3，......，aib}。任意正整数j，且j≤b，aij∈Ai，Vy为属性aij的值。如图4所示，组件属性集合代码Vcode的生成方法如下：

（1）设定i初始值为1，设定Vcode=“”，即空字符；

（2）设定j初始值为1，aij=ai1；

（3）若aij的值不为空：若Vcode为空，Vcode=aij+“:”+Vj，若Vcode不为空，Vcode=Vcode+“:”+aij+“:”+Vj；转到（4）；

（4）若j＜b，j=j+1，转到（3）；否则，转到（5）；

（5）若i＜a，i=i+1，转到（2）；否则，转到（6）；

（6）结束。

至此，页面组件C的组件属性集合代码生成完毕。

本实施例S42~S45，组件关系链中任意组件顺序集合Lx={Lx1，Lx2，Lx3，......，Lxc}，从Lx1到Lxc为父-子关系顺序排列，Lx1为关系链的根结点，排列在最末尾的元素Lxc表示Lx所代表的关系链中的叶子节点，但叶子节点可能存在多个，即多个叶子节点排列在集合Lx元素的最末尾。

设y为正整数，且y≤c，任意Lxy∈Lx，构建Lx中所有组件集合代码的方法如下：

（1）令y=c，Lxy=Lxc；

（2）采用前述组件属性集合代码Vcode的生成方法，生成Lxy的Vcode，并用Vcode替换组件代码模板中的标识符“******”，生成Lxy的代码LxyVcode；

（3）若y>1，y=y-1，转到（2）；否则转到（4）；

（4）Lx中所有页面组件的代码生成完毕后，再对组件进行父子组合嵌套，生成组合嵌套代码；令y=c，Lxy=Lxc；

（5）从组件关系链模型对应的结合L中按倒序寻找Lxy的上级组件，并用LxyVcode+“#####”替换上级组件代码中的“#####”；

（6）若y>1，y=y-1，转到（5）；否则转到（7）；

（7）将元素Lx1的代码中的“#####”全部替换为“”，即空字符；

（8）结束。

至此，元素Lx1~Lxc的代码段，即关系链模型所对应的集合L中所有元素的关系链代码段生成完毕。

本实施例S46，组件关系链模型对应的集合L={L1，L2，L3，......，Ln}，遍历关系该集合中的所有元素，并对每个元素所对应的关系链代码段进行顺序组合，最后形成目标页面对应的目标代码，即Dom结构代码。

关系链代码段顺序组合完毕后，用代码组合结果对页面Dom的框架模板代码中的标识符“#####”进行替换即得到页面Dom的完整代码。根结点Dom的框架代码为“<html>#####<html/>”，组件关系链模型对应的集合L={L1，L2，L3，......，Ln}，设y2为正整数，且y2≤n，Dcode=“<html>#####<html/>”，则目标代码生成方法如下：

（1）令y2=1，Ly2=L1；

（2）取L1的代码yCode，用yCode+“#####”替换Dcode中的标识符“#####”；

（3）若y2＜n，y2=y2+1，转到（2）；否则转到（4）；

（4）用空字符“”替换Dcode中的标识符；

（5）结束。

至此，目标代码Dcode生成完毕。

本实施例的基于知识图谱的页面代码生成方法，建立了页面组件与组件属性之间的第一关系、属性分类与组件属性之间的第二关系以及页面组件相互之间的第三关系等内容；建立了页面组件与代码段之间的第一映射关系，以及组件属性与代码段之间的第二映射关系；解决了页面组件关系链构建问题，实现了代码智能生成算法，提高了页面对象代码的实现效率并避免了手工编码可能产生的问题。采用知识图谱的方法，对页面组件、属性分类、组件属性等之间的关系，以及页面组件和组件属性的代码表达进行了统一管理，实现了基础知识库和程序之间的松耦合，既提高了页面代码生成的效率，也提高了当组件增加或修改时的易扩展性。在低代码或无代码环境中通过拖拽和配置的方式实现的页面，可以直接采用本方法进行代码生成和导出，生成的代码质量高、冗余少、可读性强并易于扩展。

实施例二

如图5所示，一种基于知识图谱的页面代码生成系统，应用于实施例一中的基于知识图谱的页面代码生成方法中，包括：

知识图谱构建模块，用于建立目标页面的组件知识图谱；其中，所述目标页面包括多个页面组件；对于每个所述页面组件，所述组件知识图谱中包括所述页面组件与组件属性之间的第一关系、属性分类与所述组件属性之间的第二关系以及所述页面组件与其余所述页面组件之间的第三关系；

映射关系获取模块，用于对于每个所述页面组件，建立所述页面组件与代码段之间的第一映射关系，以及所述组件属性与代码段之间的第二映射关系，将所述第一映射关系和所述第二映射关系补充到所述组件知识图谱中，得到更新组件知识图谱；

组件关系链构建模块，用于基于所有所述第一关系、所有所述第二关系和所有所述第三关系，构建所有所述页面组件之间的组件关系链模型；

代码生成模块，用于基于所述更新组件知识图谱和所述组件关系链模型，生成所述组件关系链模型中每个元素对应的关系链代码段；并根据所有所述关系链代码段，得到所述目标页面的目标代码。

本实施例的基于知识图谱的页面代码生成系统，基于组件知识图谱的构建，对页面组件、属性分类、组件属性等之间的关系，以及页面组件和组件属性的代码表达进行了统一管理，实现了基础知识库和程序之间的松耦合，既提高了页面代码生成的效率，也提高了当组件增加或修改时的易扩展性。在低代码或无代码环境中通过拖拽和配置的方式实现的页面，可以直接采用本方法进行代码生成和导出，生成的代码质量高、冗余少、可读性强并易于扩展。

本实施例所述的基于知识图谱的页面代码生成系统各模块的功能与实施例一的基于知识图谱的页面代码生成生成方法的步骤一一对应，因此本实施例中的未尽细节，详见实施例一及图1至图4的具体描述，此处不再赘述。

实施例三

一种基于知识图谱的页面代码生成装置，包括处理器、存储器和存储在所述存储器中且可运行在所述处理器上的计算机程序，所述计算机程序运行时实现实施例一的无代码开发环境下的二维码组件与对象生成方法中的方法步骤。

通过存储在存储器上的计算机程序，并运行在处理器上，实现了基础知识库和程序之间的松耦合，既提高了页面代码生成的效率，也提高了当组件增加或修改时的易扩展性。在低代码或无代码环境中通过拖拽和配置的方式实现的页面，可以直接采用本方法进行代码生成和导出，生成的代码质量高、冗余少、可读性强并易于扩展。

所称处理器可以是中央处理单元（Central Processing Unit，CPU），还可以是其他通用处理器。通用处理器可以是微处理器或者该处理器也可以是任何常规的处理器等，处理器是计算机装置的控制中心，利用各种接口和线路连接整个计算机装置的各个部分。

存储器可用于存储计算机程序和/或模型，处理器通过运行或执行存储在存储器内的计算机程序和/或模型，以及调用存储在存储器内的数据，实现计算机装置的各种功能。存储器可主要包括存储程序区和存储数据区，其中，存储程序区可存储操作系统、至少一个功能所需的应用程序（例如声音播放功能、图像播放功能等）；存储数据区可存储根据手机的使用所创建的数据（例如音频数据、视频数据等）。此外，存储器可以包括高速随机存取存储器，还可以包括非易失性存储器，例如硬盘、内存、插接式硬盘，智能存储卡（SmartMedia Card，SMC），安全数字（Secure Digital，SD）卡，闪存卡（Flash Card）、至少一个磁盘存储器件、闪存器件、或其他易失性固态存储器件。

应理解可由计算机程序实现流程图和/或方框图中的每一流程和/或方框、以及流程图和/或方框图中的流程和/或方框的结合。可提供这些计算机程序到通用计算机、专用计算机、嵌入式处理机或其他可编程数据处理设备的处理器以产生一个机器，使得通过计算机或其他可编程数据处理设备的处理器执行的指令产生用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的装置。

这些计算机程序也可存储在能引导计算机或其他可编程数据处理设备以特定方式工作的计算机可读存储器中，使得存储在该计算机可读存储器中的指令产生包括指令装置的制造品，该指令装置实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能。

这些计算机程序也可装载到计算机或其他可编程数据处理设备上，使得在计算机或其他可编程设备上执行一系列操作步骤以产生计算机实现的处理，从而在计算机或其他可编程设备上执行的指令提供用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的步骤。

本实施例还提供一种计算机存储介质，所述计算机存储介质包括：至少一个指令，在所述指令被执行时实现实施例一的基于知识图谱的页面代码生成方法中的方法步骤。

通过执行包含至少一个指令的计算机存储介质，实现了基础知识库和程序之间的松耦合，既提高了页面代码生成的效率，也提高了当组件增加或修改时的易扩展性。在低代码或无代码环境中通过拖拽和配置的方式实现的页面，可以直接采用本方法进行代码生成和导出，生成的代码质量高、冗余少、可读性强并易于扩展。

同理，实施例三的未尽细节，详见实施例一、实施例二及图1至图5的具体描述，此处不再赘述。

虽然结合附图描述了本发明的实施例，但是本领域技术人员可以在不脱离本发明的精神和范围的情况下作出各种修改和变型，这样的修改和变型均落入由所附权利要求所限定的范围之内。

Claims (9)

1.一种基于知识图谱的页面代码生成方法，其特征在于，包括：

建立目标页面的组件知识图谱；其中，所述目标页面包括多个页面组件；对于每个所述页面组件，所述组件知识图谱中包括所述页面组件与组件属性之间的第一关系、属性分类与所述组件属性之间的第二关系以及所述页面组件与其余所述页面组件之间的第三关系；

对于每个所述页面组件，建立所述页面组件与代码段之间的第一映射关系，以及所述组件属性与代码段之间的第二映射关系，将所述第一映射关系和所述第二映射关系补充到所述组件知识图谱中，得到更新组件知识图谱；

基于所有所述第一关系、所有所述第二关系和所有所述第三关系，构建所有所述页面组件之间的组件关系链模型；

基于所述更新组件知识图谱和所述组件关系链模型，生成所述组件关系链模型中每个元素对应的关系链代码段；并根据所有所述关系链代码段，得到所述目标页面的目标代码；

所述基于所有所述第一关系、所有所述第二关系和所有所述第三关系，构建所有所述页面组件之间的组件关系链模型，包括：

基于所有所述第一关系、所有所述第二关系和所有所述第三关系，为每个所述页面组件增加上级组件属性，并为增加的所述上级组件属性赋予对应的上级组件属性值；

基于增加的所述上级组件属性以及对应的所述上级组件属性值，按照父-子关系，对所有所述页面组件进行检索，得到所有所述页面组件之间的所述组件关系链模型；

所述组件关系链模型的表达式为：L={L1，L2，L3，......，Ln}；

其中，L为所述组件关系链模型对应的集合，n为所述页面组件增加的所述上级组件属性为空的组件总数；任意Lx∈L表示一条从根节点的页面组件到叶子节点的页面组件的组件顺序集合，x为任意正整数，且x≤n。

2.根据权利要求1所述的方法，其特征在于，所述属性分类包括基础属性、位置属性、外观属性、原生属性、样式属性、表单属性、图表属性和扩展属性。

3.根据权利要求1所述的方法，其特征在于，所述页面组件与所述组件属性之间的第一关系具体表现为包含属性或不包含属性；

所述属性分类与所述组件属性之间的第二关系具体表现为包含属性或不包含属性；

所述页面组件与其余所述页面组件之间的第三关系具体表现为可嵌套或不可嵌套。

4.根据权利要求1所述的方法，其特征在于，所述页面组件与代码段之间的所述第一映射关系具体为框架表达关系；

所述组件属性与代码段之间的所述第二映射关系具体为代码表达关系。

5.根据权利要求4所述的方法，其特征在于，所述页面组件包括容器组件和非容器组件；

当所述页面组件为容器组件时，所述页面组件与代码段之间对应的所述框架表达关系式具体为“<容器组件名 ******>#####<容器组件名/>”；

当所述页面组件为非容器组件时，所述页面组件与代码段之间对应的所述框架表达关系式具体为“<组件名 ******/>”；

其中，“******”和“#####”均为标识符，作为在自动生成代码过程中进行替换的位置标识。

6.根据权利要求1所述的方法，其特征在于，所述基于所述更新组件知识图谱和所述组件关系链模型，生成所述组件关系链模型中每个元素对应的关系链代码段；并根据所有所述关系链代码段，得到所述目标页面的目标代码，包括：

基于所述更新组件知识图谱，生成每个所述页面组件对应的组件属性集合代码；

选取所述组件关系链模型中任一个所述组件顺序集合Lx，按照生成所述组件属性集合代码同样的方法，生成选取的所述组件顺序集合Lx的组件集合代码；

根据选取的所述组件顺序集合Lx的所述组件集合代码以及所述组件顺序集合Lx中每个所述页面组件对应的所述组件属性集合代码，对选取的所述组件顺序集合Lx中所有所述页面组件进行父子组合嵌套，生成选取的所述组件顺序集合Lx对应的组合嵌套代码；

根据选取的所述组件顺序集合Lx的所述组件集合代码和所述组合嵌套代码，得到所述组件关系链模型中选取的所述组件顺序集合Lx对应的所述关系链代码段；

遍历所述组件关系链模型中的每个所述组件顺序集合，得到所述组件关系链模型中每个元素对应的所述关系链代码段；

对所述组件关系链模型中所有元素的所述关系链代码段进行顺序组合，得到所述目标页面的所述目标代码。

7.一种基于知识图谱的页面代码生成系统，其特征在于，应用于如权利要求1至6任一项所述的基于知识图谱的页面代码生成方法中，包括：

知识图谱构建模块，用于建立目标页面的组件知识图谱；其中，所述目标页面包括多个页面组件；对于每个所述页面组件，所述组件知识图谱中包括所述页面组件与组件属性之间的第一关系、属性分类与所述组件属性之间的第二关系以及所述页面组件与其余所述页面组件之间的第三关系；

映射关系获取模块，用于对于每个所述页面组件，建立所述页面组件与代码段之间的第一映射关系，以及所述组件属性与代码段之间的第二映射关系，将所述第一映射关系和所述第二映射关系补充到所述组件知识图谱中，得到更新组件知识图谱；

组件关系链构建模块，用于基于所有所述第一关系、所有所述第二关系和所有所述第三关系，构建所有所述页面组件之间的组件关系链模型；

代码生成模块，用于基于所述更新组件知识图谱和所述组件关系链模型，生成所述组件关系链模型中每个元素对应的关系链代码段；并根据所有所述关系链代码段，得到所述目标页面的目标代码；

所述组件关系链构建模块具体用于：

基于所有所述第一关系、所有所述第二关系和所有所述第三关系，为每个所述页面组件增加上级组件属性，并为增加的所述上级组件属性赋予对应的上级组件属性值；

基于增加的所述上级组件属性以及对应的所述上级组件属性值，按照父-子关系，对所有所述页面组件进行检索，得到所有所述页面组件之间的所述组件关系链模型；

所述组件关系链模型的表达式为：L={L1，L2，L3，......，Ln}；

其中，L为所述组件关系链模型对应的集合，n为所述页面组件增加的所述上级组件属性为空的组件总数；任意Lx∈L表示一条从根节点的页面组件到叶子节点的页面组件的组件顺序集合，x为任意正整数，且x≤n。

8.一种基于知识图谱的页面代码生成装置，其特征在于，包括处理器、存储器和存储在所述存储器中且可运行在所述处理器上的计算机程序，所述计算机程序运行时实现如权利要求1至6任一项所述的方法步骤。

9.一种计算机存储介质，其特征在于，所述计算机存储介质包括：至少一个指令，在所述指令被执行时实现如权利要求1至6任一项所述的方法步骤。