CN114048415A - 表单生成方法及装置、电子设备和计算机可读存储介质 - Google Patents

表单生成方法及装置、电子设备和计算机可读存储介质 Download PDF

Info

Publication number
CN114048415A
CN114048415A CN202111372130.4A CN202111372130A CN114048415A CN 114048415 A CN114048415 A CN 114048415A CN 202111372130 A CN202111372130 A CN 202111372130A CN 114048415 A CN114048415 A CN 114048415A
Authority
CN
China
Prior art keywords
data
function
determining
generation
acquiring
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Pending
Application number
CN202111372130.4A
Other languages
English (en)
Inventor
蒋孝威
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Beijing Jingdong Century Trading Co Ltd
Beijing Wodong Tianjun Information Technology Co Ltd
Original Assignee
Beijing Jingdong Century Trading Co Ltd
Beijing Wodong Tianjun Information Technology Co Ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Beijing Jingdong Century Trading Co Ltd, Beijing Wodong Tianjun Information Technology Co Ltd filed Critical Beijing Jingdong Century Trading Co Ltd
Priority to CN202111372130.4A priority Critical patent/CN114048415A/zh
Publication of CN114048415A publication Critical patent/CN114048415A/zh
Pending legal-status Critical Current

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90Details of database functions independent of the retrieved data types
    • G06F16/95Retrieval from the web
    • G06F16/958Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00Arrangements for program control, e.g. control units
    • G06F9/06Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/44Arrangements for executing specific programs
    • G06F9/451Execution arrangements for user interfaces

Abstract

本公开是关于一种表单生成方法及装置、电子设备以及计算机可读存储介质,涉及前端开发技术领域,可以应用于前端表单开发的场景。该方法包括:获取表单生成数据;获取表单展示配置文件,基于表单生成数据与表单展示配置文件确定表单展示信息;确定表单生成数据对应的数据变动记录,根据数据变动记录生成数据联动信息;根据表单生成数据、表单展示信息与数据联动信息生成目标表单。本公开可以实现表单展示、表单校验与表单数据联动三者之间的逻辑联合,提供一种自动表单生成方案。

Description

表单生成方法及装置、电子设备和计算机可读存储介质
技术领域
本公开涉及前端开发技术领域,具体而言,涉及一种表单生成方法、表单生成装置、电子设备以及计算机可读存储介质。
背景技术
前端开发是创建万维网(World Wide Web,WEB)页面或应用程序(Application,APP)等前端界面呈现给用户的过程。在前端开发过程中,前端表单作为用户用户数据信息的各种表单元素的集合区域,可以用于获取用户输入数据以实现网页上的数据交互。
目前,在前端表单开发过程中,可以采用多种表单开发方式进行表单开发操作,例如:手动开发;使用界面设计(User Interface,UI)主题库,如Antd主题库;表单逻辑生成;拖拽生成表单;人工智能(Artificial Intelligence,AI)生成表单等等。
需要说明的是,在上述背景技术部分公开的信息仅用于加强对本公开的背景的理解,因此可以包括不构成对本领域普通技术人员已知的现有技术的信息。
发明内容
本公开的目的在于提供一种表单生成方法、表单生成装置、电子设备以及计算机可读存储介质,进而至少在一定程度上克服现有的表单开发方式无法实现表单校验、表单展示与表单数据联动三者联合以生成表单的问题。
本公开的其他特性和优点将通过下面的详细描述变得显然,或部分地通过本发明的实践而习得。
根据本公开的第一方面,提供一种表单生成方法,包括:获取表单生成数据;获取表单展示配置文件,基于表单生成数据与表单展示配置文件确定表单展示信息;确定表单生成数据对应的数据变动记录,根据数据变动记录生成数据联动信息;根据表单生成数据、表单展示信息与数据联动信息生成目标表单。
在本公开的一种示例性实施方案中,获取表单生成数据,包括:响应于数据输入操作,获取初始输入数据;获取表单数据规范文件,根据表单数据规范文件对初始输入数据校验处理,确定初始输入数据中包含的待过滤数据;对待过滤数据进行数据过滤处理,以得到表单生成数据。
在本公开的一种示例性实施方案中,上述方法还包括:获取自定义函数模板,对自定义函数模板进行函数配置操作,以得到自定义校验函数;获取插件校验模板,对插件校验模板进行插件配置操作,以得到扩展校验插件;通过自定义校验函数与扩展校验插件进行表单校验操作。
在本公开的一种示例性实施方案中,表单生成数据包括表单主题数据与表单类型数据,基于表单生成数据与表单展示配置文件确定表单展示信息,包括:获取表单主题数据中的表单主题字段;根据表单展示配置文件与表单主题字段确定表单展示主题;获取表单类型数据中各表单类型的表单类型字段;根据表单展示配置文件与表单类型字段确定表单类型样式。
在本公开的一种示例性实施方案中,上述方法还包括:获取自定义组件数据;自定义组件数据包括自定义组件字段;根据自定义组件字段与自定义组件配置文件确定自定义组件的组件类型样式。
在本公开的一种示例性实施方案中,表单生成数据包括内部表单数据,确定表单生成数据对应的数据变动记录,包括:获取依赖数组,通过依赖数组对内部表单数据进行数据监听操作,以确定数据变动记录;获取状态提升函数,通过状态提升函数对内部表单数据进行状态提升处理,得到内部提升表单数据;通过外部操作控制内部提升表单数据,以确定数据变动记录。
在本公开的一种示例性实施方案中,根据数据变动记录生成数据联动信息,包括:获取预先配置的数据联动函数;数据联动函数包括联动函数体与函数占位符;基于数据联动函数与数据变动记录生成数据联动信息。
根据本公开的第二方面,提供一种表单生成装置,包括:生成数据获取模块,用于获取表单生成数据;展示信息确定模块,用于获取表单展示配置文件,基于表单生成数据与表单展示配置文件确定表单展示信息;联动信息确定模块,用于确定表单生成数据对应的数据变动记录,根据数据变动记录生成数据联动信息;表单生成模块,用于根据表单生成数据、表单展示信息与数据联动信息生成目标表单。
在本公开的一种示例性实施方案中,生成数据获取模块包括生成数据获取单元,用于响应于数据输入操作,获取初始输入数据;获取表单数据规范文件,根据表单数据规范文件对初始输入数据校验处理,确定初始输入数据中包含的待过滤数据;对待过滤数据进行数据过滤处理,以得到表单生成数据。
在本公开的一种示例性实施方案中,表单生成装置还包括表单校验模块,用于获取自定义函数模板,对自定义函数模板进行函数配置操作,以得到自定义校验函数;获取插件校验模板,对插件校验模板进行插件配置操作,以得到扩展校验插件;通过自定义校验函数与扩展校验插件进行表单校验操作。
在本公开的一种示例性实施方案中,展示信息确定模块包括第一表单展示单元,用于获取表单主题数据中的表单主题字段;根据表单展示配置文件与表单主题字段确定表单展示主题;获取表单类型数据中各表单类型的表单类型字段;根据表单展示配置文件与表单类型字段确定表单类型样式。
在本公开的一种示例性实施方案中,展示信息确定模块还包括第二表单展示单元,用于获取自定义组件数据;自定义组件数据包括自定义组件字段;根据自定义组件字段与自定义组件配置文件确定自定义组件的组件类型样式。
在本公开的一种示例性实施方案中,联动信息确定模块包括变动记录确定单元,用于获取依赖数组,通过依赖数组对内部表单数据进行数据监听操作,以确定数据变动记录;获取状态提升函数,通过状态提升函数对内部表单数据进行状态提升处理,得到内部提升表单数据;通过外部操作控制内部提升表单数据,以确定数据变动记录。
在本公开的一种示例性实施方案中,联动信息确定模块包括联动信息确定单元,用于获取预先配置的数据联动函数;数据联动函数包括联动函数体与函数占位符;基于数据联动函数与数据变动记录生成数据联动信息。
根据本公开的第三方面,提供一种电子设备,包括:处理器;以及存储器,所述存储器上存储有计算机可读指令,所述计算机可读指令被所述处理器执行时实现根据上述任意一项所述的表单生成方法。
根据本公开的第四方面,提供一种计算机可读存储介质,其上存储有计算机程序,所述计算机程序被处理器执行时实现根据上述任意一项所述的表单生成方法。
本公开提供的技术方案可以包括以下有益效果:
本公开的示例性实施例中的表单生成方法,获取表单生成数据;获取表单展示配置文件,基于表单生成数据与表单展示配置文件确定表单展示信息;确定表单生成数据对应的数据变动记录,根据数据变动记录生成数据联动信息;根据表单生成数据、表单展示信息与数据联动信息生成目标表单。一方面,通过配置表单展示配置文件,可以实现表单的快速配置,同时支持表单展示的多种主题,如自定义主题。另一方面,将表单展示、表单校验与表单数据联动三者联合生成表单,可以减少表单生成的手动开发操作,使表单生成过程更加自动化,提高表单生成效率。
应当理解的是,以上的一般描述和后文的细节描述仅是示例性和解释性的,并不能限制本公开。
附图说明
此处的附图被并入说明书中并构成本说明书的一部分,示出了符合本公开的实施例,并与说明书一起用于解释本公开的原理。显而易见地,下面描述中的附图仅仅是本公开的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动的前提下,还可以根据这些附图获得其他的附图。在附图中:
图1示意性示出了根据本公开的示例性实施方式的表单生成方法的流程图;
图2示意性示出了根据本公开的示例性实施方式的表单生成方案对应的技术架构图;
图3示意性示出了根据本公开的示例性实施方式的jsonSchema校验器ajv进行数据校验的过程图;
图4示意性示出了根据本公开的示例性实施方式的对表单进行扩展校验的校验逻辑图;
图5示意性示出了根据本公开的示例性实施方式的通过配置UISchema以实现表单展示逻辑的结构图;
图6示意性示出了根据本公开的示例性实施方式的提升内部数据以达到外部控制内部表单数据的逻辑架构图;
图7示意性示出了根据本公开的示例性实施方式的表单生成装置的方框图;
图8示意性示出了根据本公开一示例性实施例的电子设备的框图;
图9示意性示出了根据本公开一示例性实施例的计算机可读存储介质的示意图。
具体实施方式
现在将参考附图更全面地描述示例实施例。然而,示例实施例能够以多种形式实施,且不应被理解为限于在此阐述的实施例;相反,提供这些实施例使得本公开将全面和完整,并将示例实施例的构思全面地传达给本领域的技术人员。在图中相同的附图标记表示相同或类似的部分,因而将省略对它们的重复描述。
此外,所描述的特征、结构或特性可以以任何合适的方式结合在一个或更多实施例中。在下面的描述中,提供许多具体细节从而给出对本公开的实施例的充分理解。然而,本领域技术人员将意识到,可以实践本公开的技术方案而没有所述特定细节中的一个或更多,或者可以采用其它的方法、组元、装置、步骤等。在其它情况下,不详细示出或描述公知结构、方法、装置、实现、材料或者操作以避免模糊本公开的各方面。
附图中所示的方框图仅仅是功能实体,不一定必须与物理上独立的实体相对应。即,可以采用软件形式来实现这些功能实体,或在一个或多个软件硬化的模块中实现这些功能实体或功能实体的一部分,或在不同网络和/或处理器装置和/或微控制器装置中实现这些功能实体。
在前端开发过程中,一些常用的前端表单开发方式可以包括以下几种:(1)手动开发方式,开发者需要编写表单展示、表单校验以及表单联动数据等相关的代码。(2)使用antd等UI主题库进行表单开发。开发者可以按照主题库的文档快速编写表单展示代码。(3)表单逻辑生成。表单逻辑生成可以包括简单表单配置、复杂表单配置以及自定义表单配置等。在进行简单表单的配置生成时,首先开发者针对一系列的表单定义一份配置,然后其余开发者编写配置来生成表单;其中,界面展示部分通过配置生成,校验逻辑、联动逻辑需要开发。在复杂表单的配置生成过程中,界面展示部分以及校验逻辑通过配置生成;表单联动逻辑需要开发。在自定义表单的配置生成方案中,界面展示部分、校验逻辑、表单联动逻辑均通过配置生成。(4)拖拽生成表单。自定义配置可以实现一个拖拽生成自定义配置的平台,开发人员可以通过拖拽生成表单。(5)AI生成表单。在通过AI生成表单过程中,AI可以自动根据设计稿生成表单。
然而,上述表单开发方式存在下述缺陷:例如,手动开发表单会花费大量的开发时间。使用主题库进行表单开发时,表单的校验、联动仍然需要开发。自定义配置不能满足所有校验、联动场景;自定义配置转换出来的表单性能差;自定义配置支持的主题受限。拖拽生成在自定义配置基础上实现;拖拽生成的能力限制于自定义配置支持的能力。AI生成无法实现表单自定义校验、高级联动场景。
基于此,根据本公开的实施方式,提出了一种表单生成方法、表单生成装置、介质和电子设备。
在本文中,需要理解的是,所涉及的术语,比如,jsonSchema,jsonSchema是一个词汇表,可以允许注释和验证JSON文档。用户界面(UI)可以是系统和用户之间进行交互和信息交换的媒介,它实现信息的内部形式与人类可以接受形式之间的转换。Antd是基于AntDesign设计体系的React UI组件库,主要用于研发企业级中后台产品。Drip-form是本公开所采用的业务实现。react hooks是React 16.8中的新增功能,它可以支持无需编写类即可使用状态和其他React功能。ajv可以是jsonSchema校验器。ajv-erros可以是基于ajv的自定义错误展示实现。ajv-keywords可以是基于ajv的自定义关键字实现。
在本示例实施例中,首先提供了一种表单生成方法,可以利用服务器来实现本公开的表单生成方法,也可以利用终端设备来实现本公开所述的方法,其中,本公开中描述的终端可以包括诸如手机、平板电脑、笔记本电脑、掌上电脑、个人数字助理(PersonalDigital Assistant,PDA)等移动终端,以及诸如台式计算机等固定终端。图1示意性示出了根据本公开的一些实施例的表单生成方法流程的示意图。参考图1,该表单生成方法可以包括以下步骤:
步骤S110,获取表单生成数据。
在本公开的一些示例性实施方式中,表单生成数据可以是用于生成目标表单所采用的数据,例如表单生成数据可以是JS对象简谱(JavaScript Object Notation,JSON)文件格式的数据。
在生成目标表单之前,可以先获取表单生成数据,例如,用户可以通过前端开发工具输入json文件格式的数据作为表单生成数据。
步骤S120,获取表单展示配置文件,基于表单生成数据与表单展示配置文件确定表单展示信息。
在本公开的一些示例性实施方式中,表单展示配置文件可以是用于确定表单展示逻辑的相关配置文件。表单展示信息可以是用于确定目标表单展示样式的相关信息,例如,表单展示信息可以包括表单主题的主题样式以及表单类型的具体类型样式。
在生成目标表单时,可以预先配置表单展示配置文件,用户可以在表单展示配置文件配置表单的相关展示逻辑。举例而言,可以通过Schema前端UI框架中的UISchema的配置操作,对表单主题与表单类型等相关展示逻辑行配置。通过表单展示配置文件,用户可以自定义表单主题与表单类型。
在获取到表单生成数据后,可以根据表单生成数据中与表单展示相关的数据与表单展示配置文件中的配置信息确定出表单展示信息,例如,确定表单展示的具体表单主题与表单中包含的表单类型等展示信息,以便根据表单展示信息生成目标表单。
步骤S130,确定表单生成数据对应的数据变动记录,根据数据变动记录生成数据联动信息。
在本公开的一些示例性实施方式中,数据变动记录可以是生成目标表单所对应的表单数据的具体变化情况。数据联动信息可以是目标表单中多个表单之间数据联合变化的相关信息。
在表单生成过程中,可以获取表单中的所有数据,如表单内部所有数据,确定内部所有数据是否产生数据变动,如果内部数据有数据变动产生,则确定内部表单数据的数据变动情况,生成数据变动记录。根据得到的数据变动记录可以生成多个表单之间的数据联动信息,即一个表单中的数据变化引起与之关联的一个或多个表单之间的数据变化,产生数据联动。例如,当用户所操作的表单是一个地址选择表单时,用户在选择省级行政区的地址信息,与之相关联的市(县)级行政区的地址内容与区(镇)级行政区的地址内容也随之发生变化,产生不同行政区地址之间的数据联动。
步骤S140,根据表单生成数据、表单展示信息与数据联动信息生成目标表单。
在本公开的一些示例性实施方式中,目标表单可以是根据表单生成数据所生成的表单。
由于表单生成数据可以确定出表单生成所使用的相关数据;表单展示信息可以确定出表单在前端页面展示时的表单展示主题与表单类型,即确定出表单的具体展示样式;另外,数据联动信息可以包含多个表单之间的数据变化情况。参考图2,图2示意性示出了根据本公开的示例性实施方式的表单生成方案对应的技术架构图。从图2中可知,生成目标表单所采用的技术架构中可以包括:hooks和工具方法、校验插件、主体插件以及渲染引擎等功能模块。在获取到表单生成数据、表单展示信息与数据联动信息之后,可以采用图2中的技术架构并结合上述三种信息生成静态表单、动态表单等类型的目标表单,以通过前端页面将生成的目标表单展示给用户。
根据本示例实施例中的表单生成方法,一方面,通过配置表单展示配置文件,可以实现表单的快速配置,同时支持表单展示的多种主题,如自定义主题。另一方面,将表单展示、表单校验与表单数据联动三者联合生成表单,可以减少表单生成的手动开发操作,使表单生成过程更加自动化,提高表单生成效率。
下面,将对本示例实施例中的表单生成方法进行进一步的说明。
在本公开的一种示例性实施方案中,响应于数据输入操作,获取初始输入数据;获取表单数据规范文件,根据表单数据规范文件对初始输入数据校验处理,确定初始输入数据中包含的待过滤数据;对待过滤数据进行数据过滤处理,以得到表单生成数据。
其中,初始输入数据可以是用户通过前端设计页面输入以用于生成表单的相关数据。表单数据规范文件可以是用于确定表单数据的规范数据格式的配置文件。待过滤数据可以是初始输入数据中所包含的错误数据的相关信息。数据过滤处理可以是对初始输入数据中的错误数据进行数据过滤处理的具体过程。
在生成表单之前,用户可以输入json文件作为初始输入数据。响应于用户的数据输入操作,可以获取到初始输入数据。为了让生成的表单可以正常显示,可以定义表单支持的数据格式,并将定义出的规范数据格式存储至表单数据规范文件中。由于初始输入数据中可能包含一些不符合规范数据格式的数据,在获取到初始输入数据后,可以根据表单数据规范文件对初始输入数据进行数据校验处理。继续参考图2,图2中ajv可以用于校验jsonSchema配置,用于实现表单的大部分校验逻辑。
具体的,参考图3,图3示意性示出了根据本公开的示例性实施方式的jsonSchema校验器ajv进行数据校验的过程图。用户可以通过配置数据的jsonSchema来定义表单支持的数据格式。在获取到初始输入数据后,可以根据表单数据规范文件jsonSchema并通过校验器ajv对初始输入数据进行数据校验处理,判断初始表单数据是否满足编写的jsonSchema格式。在数据校验处理结束后,可以对初始输入数据中的待过滤数据进行数据过滤处理,例如,通过参数visibleFieldKey进行数据过滤处理,控制只返回用户可见的表单。
在本公开的一种示例性实施方案中,获取自定义函数模板,对自定义函数模板进行函数配置操作,以得到自定义校验函数;获取插件校验模板,对插件校验模板进行插件配置操作,以得到扩展校验插件;通过自定义校验函数与扩展校验插件进行表单校验操作。
其中,自定义函数模板可以是用于配置自定义函数所采用的函数模板。函数配置操作可以是进行自定义函数配置的相关操作。自定义校验函数可以是基于自定义函数模板进行函数配置操作后所生成的表单逻辑校验函数。插件校验模板可以是用于创建自定义插件所采用的模板。插件配置操作可以是基于插件校验模板进行自定义插件配置的先关操作。扩展校验插件可以通过插件配置操作扩展生成的的自定义校验插件。表单校验操作可以是对表单的相关逻辑进行校验的操作。
在进行表单校验时,通过ajv配合ajv-keyword与ajv-errors可以实现大部分表单校验场景。然而,采用上述校验方式,某些特殊情况的校验仍然不满足,例如,异步校验与业务相关的校验无法通过上述校验工具实现。因此,可以通过扩展校验逻辑扩展校验能力。参考图4,图4示意性示出了根据本公开的示例性实施方式的对表单进行扩展校验的校验逻辑图。在确定自定义校验函数时,可以先获取自定义函数模板,用户可以基于自定义函数模板进行函数配置操作,例如,用户可以通过配置onValidate进行函数配置操作,生成自定义校验函数,以拓展自定义校验。
进一步地,本公开还可以采用各种自定义校验插件进行表单校验操作,与配置自定义校验函数类似,可以通过下述步骤定义扩展校验插件:获取插件校验模板,基于插件校验模板进行插件配置操作,得到多个扩展校验插件,例如,可以通过配置validatePlugins来实现各种扩展校验插件。在得到自定义校验函数与扩展校验插件后,可以根据自定义校验函数与扩展校验插件进行表单校验操作。另外,表单校验操作还可以采用手写校验逻辑实现,或者配合表单异步校验async-validator函数实现。
在本公开的一种示例性实施方案中,获取表单主题数据中的表单主题字段;根据表单展示配置文件与表单主题字段确定表单展示主题;获取表单类型数据中各表单类型的表单类型字段;根据表单展示配置文件与表单类型字段确定表单类型样式。
其中,表单主题数据可以是用于确定目标表单的表单主题的相关数据。表单类型数据可以是用于确定目标表单所包含的具体表单类型的数据。表单主题字段可以是用于确定目标表单的表单主题所采用的字段。表单展示主题可以是目标表单中所展示的主题。表单类型字段以是用于确定目标表单的具体表单类型所采用的字段。表单类型样式可以是目标表单中所包含的表单类型的具体展示样式。表单展示信息可以包括表单展示主题与表单类型样式等相关信息。
参考图5,图5示意性示出了根据本公开的示例性实施方式的通过配置UISchema以实现表单展示逻辑的结构图。用户通过配置uiSchema来支持表单的展示信息,在确定出表单主题数据中对应的表单主题字段后,可以通过表单展示配置文件与表单主题字段的具体信息确定目标表单对应的表单展示主题。另外,根据表单类型数据可以确定出表单中包含的各种表单类型对应的表单类型字段,在确定出一个或多个表单类型字段后,可以根据表单展示配置文件与表单类型字段确定目标表单对应的表单类型样式。
具体的,用户可以通过配置theme定制表单使用的主题,用户配置的uiSchema中的theme字段可以用于确定表单使用何种主题。如图5所示,表单主题库可以包括Antd主题库,babel-ui主题库,Drip-design主题库以及一些其他自定义表单主题。用户通过配置type定制表单使用的表单类型,通过确定解析uiSchema的propertied[fieldKey].type字段确定定渲染的表单是何种类型,例如,表单类型可以包括输入框、单选、多选、下拉菜单等多种类型。通过透传其余字段给主题插件,可以实现表单的UI控制。
在本公开的一种示例性实施方案中,获取自定义组件数据;自定义组件数据包括自定义组件字段;根据自定义组件字段与自定义组件配置文件确定自定义组件的组件类型样式。
其中,自定义组件数据可以是用于配置自定义组件的相关数据。自定义组件字段可以是用于扩展表单的主题库所支持的表单类型所采用的组件字段。自定义组件配置文件可以是预先配置的用于定义表单所支持的自定义表单组件的文件。组件类型样式可以是自定义组件类型的具体样式。
为了使表单支持自定义表单组件,本公开可以通过配置uiComponents来自定义表单组件,继续参考图5,通过配置uiComponents字段来拓展主题库支持的表单类型,实现自定义type类型从而渲染自定义表单。在表单生成过程中,可以获取自定义组件数据中的自定义组件字段,根据自定义组件字段与自定义组件配置文件确定出表单中自定义表单组件的组件类型样式,以根据组件类型样式显示自定义表单组件。
在本公开的一种示例性实施方案中,获取依赖数组,通过依赖数组对内部表单数据进行数据监听操作,以确定数据变动记录;获取状态提升函数,通过状态提升函数对内部表单数据进行状态提升处理,得到内部提升表单数据;通过外部操作控制内部提升表单数据,以确定数据变动记录。
其中,依赖数组可以是React前端框架useEffect函数中的依赖数组。由于每次App组件渲染,传给Child组件的list变量都是一个全新引用地址的数组。如果Child组件将list变量放入了某个hook函数的依赖数组里,就会引起该hook函数的依赖变动。数据监听操作可以是对表单中的内部数据的数据变化情况进行监听的操作。状态提升函数可以是对内部表单数据进行状态提升处理,以实现通过外部控制内部表单数据所采用的函数。内部提升表单数据可以是经过状态提升处理后的内部表单数据。
参考图6,图6示意性示出了根据本公开的示例性实施方式的提升内部数据以达到外部控制内部表单数据的逻辑架构图。在表单生成过程中,表单的内部数据可能出现变动,为了获取到表单数据的变动情况,可以通过Ref转发来获取表单的所有数据,并通过react自带的useEffect的依赖数组来监听表单内部所有数据的变动,以实现表单数据的变动监听,确定数据变动记录。
为了获取内部表单数据的变动情况,还可以获取状态提升函数,通过状态提升函数对内部表单数据进行状态提升处理,如通过react的状态提升函数useImperativeHandle对所有内部表单数据进行数据提升处理,经过状态提升处理后的内部数据将升级为内部提升表单数据。由于表单生成方案中包含内部集成数据管理,通过提升dispatch函数达到外部操作控制内部数据,以确定数据变动记录,达到表单联动效果的目的。另外,为了监听内部表单数据的数据变动,还可以采用发布订阅机制,通过发布订阅机制确定内部表单数据的数据变动记录。
在本公开的一种示例性实施方案中,获取预先配置的数据联动函数;数据联动函数包括联动函数体与函数占位符;基于数据联动函数与数据变动记录生成数据联动信息。
其中,数据联动函数可以是用于实现多个表单之间的数据联动所采用的函数。联动函数体可以是数据联动函数所对应的函数体。函数占位符可以是数据联动函数所对应的占位符。
在监听到表单内部数据的变动情况后,可以通过数据联动函数确定数据联动信息,并根据数据联动信息实现多个表单之间的数据联动,例如可以通过配置函数体和函数占位符以及dispatch实现表单内部联动。具体的,可以编写一个函数体来实现表单的联动效果,内部数据使用react hook的useReducer的dispatch函数来控制表单数据、表单错误等数据流动。具体分为下述三类:setDataSchema类、setUiSchema类以及setFormData类。函数占位符可以确定出具体对哪几个表单之间进行数据联动。
综上所述,本公开的表单生成方法,获取表单生成数据;获取表单展示配置文件,基于表单生成数据与表单展示配置文件确定表单展示信息;确定表单生成数据对应的数据变动记录,根据数据变动记录生成数据联动信息;根据表单生成数据、表单展示信息与数据联动信息生成目标表单。一方面,通过配置表单展示配置文件,可以实现表单的快速配置,同时支持表单展示的多种主题,如自定义主题。另一方面,将表单展示、表单校验与表单数据联动三者联合生成表单,可以减少表单生成的手动开发操作,使表单生成过程更加自动化,提高表单生成效率。又一方面,通过自定义组件插件可以支持自定义表单组件,采用自定义校验函数可以实现异步校验、业务校验等自定义校验操作。
需要说明的是,尽管在附图中以特定顺序描述了本发明中方法的各个步骤,但是,这并非要求或者暗示必须按照该特定顺序来执行这些步骤,或是必须执行全部所示的步骤才能实现期望的结果。附加的或备选的,可以省略某些步骤,将多个步骤合并为一个步骤执行,以及/或者将一个步骤分解为多个步骤执行等。
此外,在本示例实施例中,还提供了一种表单生成装置。参考图7,该表单生成装置700可以包括:生成数据获取模块710、展示信息确定模块720、联动信息确定模块730以及表单生成模块740。
具体的,生成数据获取模块710,用于获取表单生成数据;展示信息确定模块720,用于获取表单展示配置文件,基于表单生成数据与表单展示配置文件确定表单展示信息;联动信息确定模块730,用于确定表单生成数据对应的数据变动记录,根据数据变动记录生成数据联动信息;表单生成模块740,用于根据表单生成数据、表单展示信息与数据联动信息生成目标表单。
在本公开的一种示例性实施方案中,生成数据获取模块包括生成数据获取单元,用于响应于数据输入操作,获取初始输入数据;获取表单数据规范文件,根据表单数据规范文件对初始输入数据校验处理,确定初始输入数据中包含的待过滤数据;对待过滤数据进行数据过滤处理,以得到表单生成数据。
在本公开的一种示例性实施方案中,表单生成装置还包括表单校验模块,用于获取自定义函数模板,对自定义函数模板进行函数配置操作,以得到自定义校验函数;获取插件校验模板,对插件校验模板进行插件配置操作,以得到扩展校验插件;通过自定义校验函数与扩展校验插件进行表单校验操作。
在本公开的一种示例性实施方案中,展示信息确定模块包括第一表单展示单元,用于获取表单主题数据中的表单主题字段;根据表单展示配置文件与表单主题字段确定表单展示主题;获取表单类型数据中各表单类型的表单类型字段;根据表单展示配置文件与表单类型字段确定表单类型样式。
在本公开的一种示例性实施方案中,展示信息确定模块还包括第二表单展示单元,用于获取自定义组件数据;自定义组件数据包括自定义组件字段;根据自定义组件字段与自定义组件配置文件确定自定义组件的组件类型样式。
在本公开的一种示例性实施方案中,联动信息确定模块包括变动记录确定单元,用于获取依赖数组,通过依赖数组对内部表单数据进行数据监听操作,以确定数据变动记录;获取状态提升函数,通过状态提升函数对内部表单数据进行状态提升处理,得到内部提升表单数据;通过外部操作控制内部提升表单数据,以确定数据变动记录。
在本公开的一种示例性实施方案中,联动信息确定模块包括联动信息确定单元,用于获取预先配置的数据联动函数;数据联动函数包括联动函数体与函数占位符;基于数据联动函数与数据变动记录生成数据联动信息。
上述中各表单生成装置的虚拟模块的具体细节已经在对应的表单生成方法中进行了详细的描述,因此此处不再赘述。
应当注意,尽管在上文详细描述中提及了表单生成装置的若干模块或者单元,但是这种划分并非强制性的。实际上,根据本公开的实施方式,上文描述的两个或更多模块或者单元的特征和功能可以在一个模块或者单元中具体化。反之,上文描述的一个模块或者单元的特征和功能可以进一步划分为由多个模块或者单元来具体化。
此外,在本公开的示例性实施例中,还提供了一种能够实现上述方法的电子设备。
所属技术领域的技术人员能够理解,本发明的各个方面可以实现为系统、方法或程序产品。因此,本发明的各个方面可以具体实现为以下形式,即:完全的硬件实施例、完全的软件实施例(包括固件、微代码等),或硬件和软件方面结合的实施例,这里可以统称为“电路”、“模块”或“系统”。
下面参考图8来描述根据本发明的这种实施例的电子设备800。图8显示的电子设备800仅仅是一个示例,不应对本发明实施例的功能和使用范围带来任何限制。
如图8所示,电子设备800以通用计算设备的形式表现。电子设备800的组件可以包括但不限于:上述至少一个处理单元810、上述至少一个存储单元820、连接不同系统组件(包括存储单元820和处理单元810)的总线830、显示单元840。
其中,所述存储单元存储有程序代码,所述程序代码可以被所述处理单元810执行,使得所述处理单元810执行本说明书上述“示例性方法”部分中描述的根据本发明各种示例性实施例的步骤。
存储单元820可以包括易失性存储单元形式的可读介质,例如随机存取存储单元(RAM)821和/或高速缓存存储单元822,还可以进一步包括只读存储单元(ROM)823。
存储单元820以包括具有一组(至少一个)程序模块825的程序/实用工具824,这样的程序模块825包括但不限于:操作系统、一个或者多个应用程序、其它程序模块以及程序数据,这些示例中的每一个或某种组合中可能包括网络环境的实现。
总线830可以为表示几类总线结构中的一种或多种,包括存储单元总线或者存储单元控制器、外围总线、图形加速端口、处理单元或者使用多种总线结构中的任意总线结构的局域总线。
电子设备800也可以与一个或多个外部设备870(例如键盘、指向设备、蓝牙设备等)通信,还可与一个或者多个使得用户能与该电子设备800交互的设备通信,和/或与使得该电子设备800能与一个或多个其它计算设备进行通信的任何设备(例如路由器、调制解调器等等)通信。这种通信可以通过输入/输出(I/O)接口850进行。并且,电子设备800还可以通过网络适配器860与一个或者多个网络(例如局域网(LAN),广域网(WAN)和/或公共网络,例如因特网)通信。如图所示,网络适配器860通过总线830与电子设备800的其它模块通信。应当明白,尽管图中未示出,可以结合电子设备800使用其它硬件和/或软件模块,包括但不限于:微代码、设备驱动器、冗余处理单元、外部磁盘驱动阵列、RAID系统、磁带驱动器以及数据备份存储系统等。
通过以上的实施例的描述,本领域的技术人员易于理解,这里描述的示例实施例可以通过软件实现,也可以通过软件结合必要的硬件的方式来实现。因此,根据本公开实施例的技术方案可以以软件产品的形式体现出来,该软件产品可以存储在一个非易失性存储介质(可以是CD-ROM,U盘,移动硬盘等)中或网络上,包括若干指令以使得一台计算设备(可以是个人计算机、服务器、终端装置、或者网络设备等)执行根据本公开实施例的方法。
在本公开的示例性实施例中,还提供了一种计算机可读存储介质,其上存储有能够实现本说明书上述方法的程序产品。在一些可能的实施例中,本发明的各个方面还可以实现为一种程序产品的形式,其包括程序代码,当所述程序产品在终端设备上运行时,所述程序代码用于使所述终端设备执行本说明书上述“示例性方法”部分中描述的根据本发明各种示例性实施例的步骤。
参考图9所示,描述了根据本发明的实施例的用于实现上述方法的程序产品900,其可以采用便携式紧凑盘只读存储器(CD-ROM)并包括程序代码,并可以在终端设备,例如个人电脑上运行。然而,本发明的程序产品不限于此,在本文件中,可读存储介质可以是任何包含或存储程序的有形介质,该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。
所述程序产品可以采用一个或多个可读介质的任意组合。可读介质可以是可读信号介质或者可读存储介质。可读存储介质例如可以为但不限于电、磁、光、电磁、红外线、或半导体的系统、装置或器件,或者任意以上的组合。可读存储介质的更具体的例子(非穷举的列表)包括:具有一个或多个导线的电连接、便携式盘、硬盘、随机存取存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(EPROM或闪存)、光纤、便携式紧凑盘只读存储器(CD-ROM)、光存储器件、磁存储器件、或者上述的任意合适的组合。
计算机可读信号介质可以包括在基带中或者作为载波一部分传播的数据信号,其中承载了可读程序代码。这种传播的数据信号可以采用多种形式,包括但不限于电磁信号、光信号或上述的任意合适的组合。可读信号介质还可以是可读存储介质以外的任何可读介质,该可读介质可以发送、传播或者传输用于由指令执行系统、装置或者器件使用或者与其结合使用的程序。
可读介质上包含的程序代码可以用任何适当的介质传输,包括但不限于无线、有线、光缆、RF等等,或者上述的任意合适的组合。
可以以一种或多种程序设计语言的任意组合来编写用于执行本发明操作的程序代码,所述程序设计语言包括面向对象的程序设计语言—诸如Java、C++等,还包括常规的过程式程序设计语言—诸如“C”语言或类似的程序设计语言。程序代码可以完全地在用户计算设备上执行、部分地在用户设备上执行、作为一个独立的软件包执行、部分在用户计算设备上部分在远程计算设备上执行、或者完全在远程计算设备或服务器上执行。在涉及远程计算设备的情形中,远程计算设备可以通过任意种类的网络,包括局域网(LAN)或广域网(WAN),连接到用户计算设备,或者,可以连接到外部计算设备(例如利用因特网服务提供商来通过因特网连接)。
此外,上述附图仅是根据本发明示例性实施例的方法所包括的处理的示意性说明,而不是限制目的。易于理解,上述附图所示的处理并不表明或限制这些处理的时间顺序。另外,也易于理解,这些处理可以是例如在多个模块中同步或异步执行的。
本领域技术人员在考虑说明书及实践这里公开的发明后,将容易想到本公开的其他实施例。本申请旨在涵盖本公开的任何变型、用途或者适应性变化,这些变型、用途或者适应性变化遵循本公开的一般性原理并包括本公开未公开的本技术领域中的公知常识或惯用技术手段。说明书和实施例仅被视为示例性的,本公开的真正范围和精神由权利要求指出。
应当理解的是,本公开并不局限于上面已经描述并在附图中示出的精确结构,并且可以在不脱离其范围进行各种修改和改变。本公开的范围仅由所附的权利要求来限。

Claims (10)

1.一种表单生成方法,其特征在于,包括:
获取表单生成数据;
获取表单展示配置文件,基于所述表单生成数据与所述表单展示配置文件确定表单展示信息;
确定所述表单生成数据对应的数据变动记录,根据所述数据变动记录生成数据联动信息;
根据所述表单生成数据、所述表单展示信息与所述数据联动信息生成目标表单。
2.根据权利要求1所述的方法,其特征在于,获取表单生成数据,包括:
响应于数据输入操作,获取初始输入数据;
获取表单数据规范文件,根据所述表单数据规范文件对所述初始输入数据校验处理,确定所述初始输入数据中包含的待过滤数据;
对所述待过滤数据进行数据过滤处理,以得到所述表单生成数据。
3.根据权利要求1所述的方法,其特征在于,所述方法还包括:
获取自定义函数模板,对所述自定义函数模板进行函数配置操作,以得到自定义校验函数;
获取插件校验模板,对所述插件校验模板进行插件配置操作,以得到扩展校验插件;
通过所述自定义校验函数与所述扩展校验插件进行表单校验操作。
4.根据权利要求1所述的方法,其特征在于,所述表单生成数据包括表单主题数据与表单类型数据,基于所述表单生成数据与所述表单展示配置文件确定表单展示信息,包括:
获取所述表单主题数据中的表单主题字段;
根据所述表单展示配置文件与所述表单主题字段确定表单展示主题;
获取所述表单类型数据中各表单类型的表单类型字段;
根据所述表单展示配置文件与所述表单类型字段确定表单类型样式。
5.根据权利要求4所述的方法,其特征在于,所述方法还包括:
获取自定义组件数据;所述自定义组件数据包括自定义组件字段;
根据所述自定义组件字段与自定义组件配置文件确定自定义组件的组件类型样式。
6.根据权利要求1所述的方法,其特征在于,所述表单生成数据包括内部表单数据,确定所述表单生成数据对应的数据变动记录,包括:
获取依赖数组,通过所述依赖数组对所述内部表单数据进行数据监听操作,以确定所述数据变动记录;
获取状态提升函数,通过所述状态提升函数对所述内部表单数据进行状态提升处理,得到内部提升表单数据;
通过外部操作控制所述内部提升表单数据,以确定所述数据变动记录。
7.根据权利要求1所述的方法,其特征在于,根据所述数据变动记录生成数据联动信息,包括:
获取预先配置的数据联动函数;所述数据联动函数包括联动函数体与函数占位符;
基于所述数据联动函数与所述数据变动记录生成所述数据联动信息。
8.一种表单生成装置,其特征在于,包括:
生成数据获取模块,用于获取表单生成数据;
展示信息确定模块,用于获取表单展示配置文件,基于所述表单生成数据与所述表单展示配置文件确定表单展示信息;
联动信息确定模块,用于确定所述表单生成数据对应的数据变动记录,根据所述数据变动记录生成数据联动信息;
表单生成模块,用于根据所述表单生成数据、所述表单展示信息与所述数据联动信息生成目标表单。
9.一种电子设备,其特征在于,包括:
处理器;以及
存储器,所述存储器上存储有计算机可读指令,所述计算机可读指令被所述处理器执行时实现根据权利要求1至7中任一项所述的表单生成方法。
10.一种计算机可读存储介质,其上存储有计算机程序,所述计算机程序被处理器执行时实现根据权利要求1至7中任一项所述的表单生成方法。
CN202111372130.4A 2021-11-18 2021-11-18 表单生成方法及装置、电子设备和计算机可读存储介质 Pending CN114048415A (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202111372130.4A CN114048415A (zh) 2021-11-18 2021-11-18 表单生成方法及装置、电子设备和计算机可读存储介质

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202111372130.4A CN114048415A (zh) 2021-11-18 2021-11-18 表单生成方法及装置、电子设备和计算机可读存储介质

Publications (1)

Publication Number Publication Date
CN114048415A true CN114048415A (zh) 2022-02-15

Family

ID=80209811

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202111372130.4A Pending CN114048415A (zh) 2021-11-18 2021-11-18 表单生成方法及装置、电子设备和计算机可读存储介质

Country Status (1)

Country Link
CN (1) CN114048415A (zh)

Cited By (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN114780196A (zh) * 2022-04-29 2022-07-22 北京百度网讯科技有限公司 一种用户界面表单渲染方法、装置、电子设备和存储介质
CN116339694A (zh) * 2023-03-07 2023-06-27 上海鸿翼软件技术股份有限公司 低代码平台组件的扩展方法、装置、电子设备及存储介质

Cited By (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN114780196A (zh) * 2022-04-29 2022-07-22 北京百度网讯科技有限公司 一种用户界面表单渲染方法、装置、电子设备和存储介质
CN114780196B (zh) * 2022-04-29 2023-07-28 北京百度网讯科技有限公司 一种用户界面表单渲染方法、装置、电子设备和存储介质
CN116339694A (zh) * 2023-03-07 2023-06-27 上海鸿翼软件技术股份有限公司 低代码平台组件的扩展方法、装置、电子设备及存储介质
CN116339694B (zh) * 2023-03-07 2023-11-17 上海鸿翼软件技术股份有限公司 低代码平台组件的扩展方法、装置、电子设备及存储介质

Similar Documents

Publication Publication Date Title
US11561846B2 (en) API notebook tool
US10705942B1 (en) Simulated testing of API
US11762634B2 (en) Systems and methods for seamlessly integrating multiple products by using a common visual modeler
KR101645052B1 (ko) 디버깅 파이프라인
US9619304B2 (en) Automatic connections between application components
WO2021184725A1 (zh) 用户界面测试方法、装置、存储介质及计算机设备
CN112765023B (zh) 测试用例生成方法、装置
CN114424257A (zh) 使用机器学习对表格数据进行自动描绘和提取
CN114048415A (zh) 表单生成方法及装置、电子设备和计算机可读存储介质
US20230229406A1 (en) Page rendering method, apparatus, electronic device, computer-readable storage medium, and computer program product
US8191041B2 (en) Javascript pre-processing framework
US11604662B2 (en) System and method for accelerating modernization of user interfaces in a computing environment
CN112799760B (zh) 一种表单渲染方法及其装置
CN113778897A (zh) 接口的自动测试方法、装置、设备及存储介质
CN113238739A (zh) 一种插件开发和数据获取方法、装置、电子设备及介质
CN109408057B (zh) 自动生成代码的方法、装置、介质和计算设备
Ahmed-Nacer et al. Model-Driven Simulation of Elastic OCCI Cloud Resources
CN110045952B (zh) 代码调用方法与装置
CN114253537A (zh) 表单生成方法及装置、电子设备和存储介质
CN116360735A (zh) 一种表单生成方法、装置、设备和介质
CN112394920B (zh) 一种应用软件开发方法、平台和电子设备
CN111767111B (zh) 页面数据处理方法及装置、电子设备和存储介质
CN113885841A (zh) 脚本生成的方法、装置、电子设备和可读介质
CN114077430A (zh) 界面生成方法、装置、电子设备及存储介质
CN112764802A (zh) 一种业务逻辑定制方法、装置、电子设备和存储介质

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination