CN113419801B - 表单渲染方法、终端、装置和计算机可读存储介质 - Google Patents

表单渲染方法、终端、装置和计算机可读存储介质 Download PDF

Info

Publication number
CN113419801B
CN113419801B CN202110669182.1A CN202110669182A CN113419801B CN 113419801 B CN113419801 B CN 113419801B CN 202110669182 A CN202110669182 A CN 202110669182A CN 113419801 B CN113419801 B CN 113419801B
Authority
CN
China
Prior art keywords
component
rendering
changed
data
attribute
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.)
Active
Application number
CN202110669182.1A
Other languages
English (en)
Other versions
CN113419801A (zh
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.)
China Mobile Communications Group Co Ltd
China Mobile Hangzhou Information Technology Co Ltd
Original Assignee
China Mobile Communications Group Co Ltd
China Mobile Hangzhou 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 China Mobile Communications Group Co Ltd, China Mobile Hangzhou Information Technology Co Ltd filed Critical China Mobile Communications Group Co Ltd
Priority to CN202110669182.1A priority Critical patent/CN113419801B/zh
Publication of CN113419801A publication Critical patent/CN113419801A/zh
Application granted granted Critical
Publication of CN113419801B publication Critical patent/CN113419801B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Images

Classifications

    • 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

Landscapes

  • Engineering & Computer Science (AREA)
  • Software Systems (AREA)
  • Theoretical Computer Science (AREA)
  • Human Computer Interaction (AREA)
  • Physics & Mathematics (AREA)
  • General Engineering & Computer Science (AREA)
  • General Physics & Mathematics (AREA)
  • Processing Or Creating Images (AREA)
  • Stored Programmes (AREA)

Abstract

本申请公开了一种表单渲染方法、终端、装置和计算机可读存储介质,表单渲染方法包括:在接收到表单数据发生变化的通知消息时,获取发生变化的表单数据;根据发生变化的表单数据确定虚拟独立层中表单组件的组件属性是否发生变化;若组件属性发生变化,则根据发生变化的表单数据对表单组件进行重渲染。如此,通过虚拟独立层实现了最小化的必要性重渲染,同时,实现了所有表单组件对全局变化的监听,保证了无冗余的重渲染,在自动化实现组件联动关系的前提下保证了表单页的交互流畅性。

Description

表单渲染方法、终端、装置和计算机可读存储介质
技术领域
本申请涉及数据处理技术领域,尤其涉及一种表单渲染方法、终端、装置和计算机可读存储介质。
背景技术
表单是一种普通的用户界面元素,为数据输入和输出提供了一种简单而直观的表现方式。在现有技术中,管理后台有大量提交表单进行运营配置的需求,这些表单根据需求的不同在布局和交互逻辑上也五花八门,其中,表单可通过开发者手动开发,也可以由引擎基于表单配置文件自动生成。而引擎自动生成表单和开发者手动开发表单的区别在于,引擎无法预先知道表单中组件的关联关系,需要对每个组件值变化进行监听,一旦某一个组件发生变化就会引起全局重渲染,此时,在页面的表现上就是用户输入比较卡顿。因此,由于出现冗余的重渲染,导致表单页面卡顿。
发明内容
本申请实施例通过提供一种表单渲染方法、终端、装置和计算机可读存储介质,旨在解决由于出现冗余的重渲染,导致表单页面卡顿的问题。
为实现上述目的,本申请一方面提供一种表单渲染方法,所述方法包括:
在接收到表单数据发生变化的通知消息时,获取发生变化的表单数据;
根据发生变化的表单数据确定虚拟独立层中表单组件的组件属性是否发生变化;
若所述组件属性发生变化,则根据发生变化的表单数据对所述表单组件进行重渲染。
可选地,所述根据发生变化的表单数据确定虚拟独立层中表单组件的组件属性是否发生变化的步骤包括:
确定所述虚拟独立层中表单组件的组件属性是否包括第一组件属性;
若包括所述第一组件属性,则将发生变化的表单数据作为参数执行所述第一组件属性中的程序;
根据执行结果确定所述表单组件的组件属性是否发生变化,其中,当所述执行结果与预设结果不一致时,确定所述组件属性发生变化。
可选地,所述根据发生变化的表单数据确定虚拟独立层中表单组件的组件属性是否发生变化的步骤,还包括:
若所述虚拟独立层中表单组件的组件属性不包括所述第一组件属性,则将发生变化的表单数据与预设数据进行比较;
根据比较结果确定所述表单组件的组件属性是否发生变化,其中,当所述比较结果为发生变化的表单数据与所述预设数据不一致时,确定所述组件属性发生变化。
可选地,所述根据发生变化的表单数据对所述表单组件进行重渲染的步骤包括:
将发生变化的表单数据发送至所述表单组件的渲染层,以使所述渲染层根据发生变化的表单数据对所述表单组件进行重渲染。
可选地,所述方法包括:
获取表单配置文件,为所述表单配置文件中的每个所述表单组件设置虚拟独立层;
在检测到表单数据发生变化时,向每个所述表单组件的虚拟独立层发送表单数据发生变化的通知消息,以使所述表单组件根据所述通知消息确定组件属性是否发生变化,并在发生变化时执行表单组件的重渲染动作。
可选地,所述获取表单配置文件的步骤之后,包括:
对所述表单配置文件进行解析得到表单配置信息,根据所述表单配置信息获取所述表单组件的标识信息;
根据所述表单组件的标识信息从组件列表中获取表单组件;
根据所述表单组件对表单进行渲染。
可选地,对所述表单组件进行校验的方法包括:
在进行单个表单组件校验时,根据校验函数对组件值发生变化的表单组件进行校验;
在进行至少两个表单组件联合校验时,根据校验函数对组件值发生变化的第一表单组件进行校验;
在所述第一表单组件校验成功时,对第二表单组件进行校验,其中,所述第二表单组件是所述第一表单组件的子表单组件。
此外,为实现上述目的,本申请另一方面还提供一种终端,所述终端包括存储器、处理器及存储在存储器上并在所述处理器上运行动物的表单渲染程序,所述处理器执行所述动物的表单渲染程序时实现如上所述表单渲染方法的步骤。
此外,为实现上述目的,本申请另一方面还提供一种表单渲染装置,所述装置包括存储器、处理器及存储在存储器上并在所述处理器上运行动物的表单渲染程序,所述处理器执行所述动物的表单渲染程序时实现如上所述表单渲染方法的步骤。
此外,为实现上述目的,本申请另一方面还提供一种计算机可读存储介质,所述计算机可读存储介质上存储有动物的表单渲染程序,所述动物的表单渲染程序被处理器执行时实现如上所述表单渲染方法的步骤。
本申请提出了一种表单渲染方法,通过在接收到表单数据发生变化的通知消息时,获取发生变化的表单数据;根据发生变化的表单数据确定虚拟独立层中表单组件的组件属性是否发生变化;若组件属性发生变化,则根据发生变化的表单数据对表单组件进行重渲染。如此,通过虚拟独立层实现了最小化的必要性重渲染,同时,实现了所有表单组件对全局变化的监听,保证了无冗余的重渲染,在自动化实现组件联动关系的前提下保证了表单页的交互流畅性。
附图说明
图1为本申请实施例方案涉及的硬件运行环境的终端结构示意图;
图2为本申请表单渲染方法第一实施例的流程示意图;
图3为本申请表单渲染方法第二实施例的流程示意图;
图4为本申请表单渲染方法中获取表单配置文件的步骤之后的流程示意图;
图5为本申请表单渲染方法中根据发生变化的表单数据确定虚拟独立层中表单组件的组件属性是否发生变化的流程示意图;
图6为引擎生成复杂页面布局示意图;
图7为本申请表单渲染方法的操作流程示意图;
图8为配置文件主要结构;
图9为布局组件layout的配置项;
图10为组件校验规则配置;
图11为表单联动规则配置;
图12为表单联合校验配置。
本申请目的的实现、功能特点及优点将结合实施例,参照附图做进一步说明。
具体实施方式
应当理解,此处所描述的具体实施例仅用以解释本申请,并不用于限定本申请。
本申请实施例的主要解决方案是:在接收到表单数据发生变化的通知消息时,获取发生变化的表单数据;根据发生变化的表单数据确定虚拟独立层中表单组件的组件属性是否发生变化;若所述组件属性发生变化,则根据发生变化的表单数据对所述表单组件进行重渲染。
由于在使用引擎自动生成表单时,引擎无法预先知道表单中组件的关联关系,需要对每个组件值变化进行监听,一旦某一个组件发生变化就会引起全局重渲染,此时,在页面的表现上就是用户输入比较卡顿。因此,由于出现冗余的重渲染,导致表单页面卡顿。而本申请通过在接收到表单数据发生变化的通知消息时,获取发生变化的表单数据;根据发生变化的表单数据确定虚拟独立层中表单组件的组件属性是否发生变化;若组件属性发生变化,则根据发生变化的表单数据对表单组件进行重渲染。如此,通过虚拟独立层实现了最小化的必要性重渲染,同时,实现了所有表单组件对全局变化的监听,保证了无冗余的重渲染,在自动化实现组件联动关系的前提下保证了表单页的交互流畅性。
如图1所示,图1为本申请实施例方案涉及的硬件运行环境的终端结构示意图。
如图1所示,该终端可以包括:处理器1001,例如CPU,网络接口1004,用户接口1003,存储器1005,通信总线1002。其中,通信总线1002用于实现这些组件之间的连接通信。用户接口1003可以包括显示屏(Display)、输入单元比如键盘(Keyboard),可选用户接口1003还可以包括标准的有线接口、无线接口。网络接口1004可选的可以包括标准的有线接口、无线接口(如WI-FI接口)。存储器1005可以是高速RAM存储器,也可以是稳定的存储器(non-volatile memory),例如磁盘存储器。存储器1005可选的还可以是独立于前述处理器1001的存储装置。
本领域技术人员可以理解,图1中示出的终端结构并不构成对终端设备的限定,可以包括比图示更多或更少的部件,或者组合某些部件,或者不同的部件布置。
如图1所示,作为一种计算机可读存储介质的存储器1005中可以包括操作系统、网络通信模块、用户接口模块以及动物的表单渲染程序。
在图1所示的终端中,网络接口1004主要用于与后台服务器进行数据通信;用户接口1003主要用于与客户端(用户端)进行数据通信;处理器1001可以用于调用存储器1005中动物的表单渲染程序,并执行以下操作:
在接收到表单数据发生变化的通知消息时,获取发生变化的表单数据;
根据发生变化的表单数据确定虚拟独立层中表单组件的组件属性是否发生变化;
若所述组件属性发生变化,则根据发生变化的表单数据对所述表单组件进行重渲染。
参考图2,图2为本申请表单渲染方法第一实施例的流程示意图。
本申请实施例提供了表单渲染方法的实施例,需要说明的是,虽然在流程图中示出了逻辑顺序,但是在某些情况下,可以以不同于此处的顺序执行所示出或描述的步骤。
表单渲染方法包括:
步骤S10,在接收到表单数据发生变化的通知消息时,获取发生变化的表单数据;
需要说明的是,表单渲染终端设置有表单引擎,表单引擎设置有实现表单渲染的组件库,组件库与表单渲染终端适配,表单渲染终端利用表单引擎执行表单渲染。其中,表单渲染终端可以包括智能手机、台式计算机、平板电脑、笔记本电脑、智能音箱、数字助理、增强现实/虚拟现实设备、智能可穿戴设备等类型的实体设备。也可以包括运行于实体设备中的软体,例如虚拟机等。
由于引擎自动生成表单时,引擎无法预先知道表单中组件的关联关系,需要对每个组件值变化进行监听,一旦某一个组件发生变化就会引起全局重渲染,此时,在页面的表现上就是用户输入比较卡顿。基于此问题,本申请为每个表单组件设置了一个独立的DF计算层(即虚拟独立层),专门用于全局监听和计算,实现内存计算和DOM渲染分离,其中,独立的DF计算层由虚拟对象模型(Document Object Model,DOM)实现,因此不会导致页面实际DOM的增加。
在任一表单组件的表单数据发生变化时,独立的DF计算层会接收到表单数据发生变化的通知消息,基于该通知消息获取发生变化的表单数据。例如,用户在表单组件A中输入了内容,引擎检测到表单组件A的数据发生变化,向各个表单组件发送表单数据发生变化的通知消息,此时,由各个表单组件中独立的DF计算层接收引擎发送的通知消息,其中,该通知消息携带有发生变化的表单数据。
步骤S20,根据发生变化的表单数据确定虚拟独立层中表单组件的组件属性是否发生变化;
独立的DF计算层在接收到发生变化的表单数据时,根据变化的表单数据计算表单组件的组件属性是否发生变化,也即,独立的DF计算层需要确认发生变化的表单数据是否与其所在的表单组件存在关联。其中,组件属性可包括null(空值),undefined(未定义),boolean(布尔值),number(数值),string(字符串),object(对象),array(数组),function(函数)这8种类型。
一实施例中,参考图5,所述根据发生变化的表单数据确定虚拟独立层中表单组件的组件属性是否发生变化的步骤包括:
步骤S21,确定所述虚拟独立层中表单组件的组件属性是否包括第一组件属性;
步骤S22,若包括所述第一组件属性,则将发生变化的表单数据作为参数执行所述第一组件属性中的程序;
步骤S23,根据执行结果确定所述表单组件的组件属性是否发生变化,其中,当所述执行结果与预设结果不一致时,确定所述组件属性发生变化。
由于组件属性包括多种类型,有些组件属性可以直接比较,即可判断组件属性是否发生变化,而有些组件属性需要先计算,再判断组件属性是否发生变化。因此,在计算组件属性是否发生变化时,需要先确定独立的DF计算层中组件属性的类型,基于组件属性的类型确定计算组件属性的方式。
当确定独立的DF计算层所在表单组件中包括第一组件属性,如function类型,此时,需要将发生变化的表单数据作为参数执行第一组件属性中的程序,再获取程序的执行结果,将该执行结果与预设结果比较,当执行结果与预设结果不一致时,确定组件属性发生变化。例如,当第一组件属性为function类型,即为函数类型,而函数是一个方法,该方法中定义了一些逻辑处理,因此,需要将发生变化的表单数据通过该方法进行逻辑处理得到处理后的新数据,该新数据的类型可以为null(空值),undefined(未定义),boolean(布尔值)等,此时,可以将新数据直接与原始数据进行比对,若新数据与原始数据不一致,则说明组件属性发生了变化,若新数据与原始数据一致,则说明组件属性没有发生变化。
一实施例中,当独立的DF计算层确定其所在的表单组件不包括第一组件属性,即独立的DF计算层中的组件属性为null(空值),undefined(未定义),boolean(布尔值),number(数值),string(字符串),object(对象),array(数组)中的一种,此时,可以直接将发生变化的表单数据与原始数据进行比较,若发生变化的数据与原始数据不一致,则说明组件属性发生了变化;若发生变化的数据与原始数据一致,则说明组件属性没有发生变化。
需要说明的是,在表单组件存在联动关系时,一个表单组件的组件属性发生变化,会影响其他表单组件的组件属性,例如,某一表单组件为省市选择器,当省份从北京改为浙江,此时,表单组件为市级选择器的组件属性也发生改变。
步骤S30,若所述组件属性发生变化,则根据发生变化的表单数据对所述表单组件进行重渲染。
在表单组件的组件属性发生变化时,由独立的DF计算层将发生变化的表单数据发送至渲染层,由渲染层根据发生变化的表单数据对表单组件进行重渲染。
本实施例通过在接收到表单数据发生变化的通知消息时,获取发生变化的表单数据;根据发生变化的表单数据确定虚拟独立层中表单组件的组件属性是否发生变化;若组件属性发生变化,则根据发生变化的表单数据对表单组件进行重渲染。如此,在引擎无法预知组件之间关系的前提下利用独立的DF计算层实现最小化的必要性重渲染,同时,实现了所有表单组件对全局变化的监听,又保证了无冗余的重渲染,在自动化实现组件联动关系的前提下保证了表单页的交互流畅性。
进一步地,参考图3,提出本申请表单渲染方法第二实施例。
所述表单渲染方法运行于控制器侧,包括以下步骤:
步骤S40,获取表单配置文件,为所述表单配置文件中的每个所述表单组件设置虚拟独立层;
步骤S50,在检测到表单数据发生变化时,向每个所述表单组件的虚拟独立层发送表单数据发生变化的通知消息,以使所述表单组件根据所述通知消息确定组件属性是否发生变化,并在发生变化时执行表单组件的重渲染动作。
在一实施例中,获取表单配置文件,由于在渲染端展示表单主要是基于JSON(JavaScriptObjectNotation,JS对象简谱)数据格式的表单引擎来实现,因此,表单配置文件为json文件。对获取到的表单配置文件进行解析,以获取表单配置文件中的各个表单组件,在每个表单组件的外设置一个虚拟独立层(即独立的DF计算层),该虚拟独立层不会导致页面元素增加,同时,虚拟独立层只在内存中,不会真的渲染到页面上。例如,页面上有100个元素,而为了要实现计算和渲染分离需要在这100个元素外面设置一个独立的DF计算层;如果独立的DF计算层是真实DOM,此时页面上就变成了200个元素,而页面上元素增多会导致卡顿,但本申请设置的DF计算层是虚拟的,因此页面实际上的元素还是100个。
引擎用一个独立的对象rootState作为总控制台角色,该对象提供一个changeValue方法,当任一表单组件的数据发生变化都会主动触发changeValue方法通知所有表单组件有变化发生。每个表单组件的DF计算层会在rootState上注册一个onChange方法用于接收该通知并接收发生变化的表单数据,并基于发生变化的表单数据计算组件属性是否发生变化,并在发生变化时执行表单组件的重渲染动作。
本实施例通过为每个表单组件设置一个虚拟独立层,在检测到表单数据发生变化时,向各个表单组件的虚拟独立层发送表单数据发生变化的通知,以使虚拟独立层基于变化的表单数据计算表单组件的组件属性是否发生变化,并在发生变化时执行表单组件的重渲染动作。如此,避免了引擎无法预先知道表单中组件的关联关系,需要对每个组件值变化进行监听,一旦某一个组件发生变化就会引起全局重渲染的问题,达到了减少冗余的重渲染,提高表单页交互流畅性的效果。
进一步地,参考图4,提出本申请表单渲染方法第三实施例。
所述表单渲染方法的第三实施例与第二实施例的区别在于,所述获取表单配置文件的步骤之后,包括:
步骤S41,对所述表单配置文件进行解析得到表单配置信息,根据所述表单配置信息获取所述表单组件的标识信息;
步骤S42,根据所述表单组件的标识信息从组件列表中获取表单组件;
步骤S43,根据所述表单组件对表单进行渲染。
需要说明的是,在现有技术中,管理后台有大量提交表单进行运营配置的需求,这些表单根据需求的不同在布局和交互逻辑上也五花八门,开发人员拿到一张表单的原型图和视觉稿后,按照需求首先实现表单的UI效果和交互操作,然后实现表单的数据逻辑,请求接口数据用于展示,编写监听函数对表单输入的变化做出实时反馈,对用户输入进行校验,编写表单项之间的关联关系,最终获取输入数据进行提交。但是,每写一个表单页都需要经历从UI开发到数据逻辑编写的完整前端开发流程,生成表单的效率低下。
基于上述问题,本申请主要从表单配置端获取一份描述性的json文件,该文件列出了所需表单组件的名称和属性,并描述了各个表单组件的包含关系,其中,不同的数据接口和复杂的校验规则在引擎中都是组件的一个配置项。表单渲染端在获取到json文件后,对该json文件进行解析得到json数据格式的表单配置信息,根据表单配置信息获取表单组件的标识信息,根据表单组件的标识信息从组件列表中获取表单组件,根据表单组件对表单进行渲染。
一实施例中,描述性json文件格式要求:
该文件主要包含四个部分,其中两个必选部分:组件列表(components)、组件层级关系(schema),两个可选部分:组件关联关系(conditions)、联合校验(jointValidate)。参考图8,图8为配置文件主要结构,根据图8可以知道,自动生成页面布局为:
引擎读取上述json文件中的schema部分,从schema下第一个组件id切入,根据组件的children递归渲染子组件,直到最后一个不包含children的组件渲染完毕。其中,参考图6,图6为引擎生成复杂页面布局示意图,layout组件可以配置为横向和纵向布局,layout组件可以包含子组件,同时也可以作为别的layout的子组件。schema中可以嵌套任意多个layout,从而渲染出复杂的页面布局,完成组件渲染后利用react的onChange函数实现对每个组件值变化的实时监听。
其中,layout也属于表单组件的一种,但它对用户不可见,layout的横向和纵向属于它的一个属性,参考图9,图9为布局组件layout的配置项。
实现规则校验:
在上述递归生成页面的过程中,引擎会根据组件id到组件列表(components)中找到该组件,将该组件的属性赋值给组件,其中,规则配置也属于一种属性(rules)。规则配置示例如下:参考图10,图10为组件校验规则配置,根据图10可以知道,规则配置为每一条校验规则在引擎内部都对应一个函数,一旦组件值发生变化时就执行这些函数对组件值进行校验。如果函数返回false则停止校验,展示配置的message内容。例如,用户的每一次输入都会触发存在性校验、长度校验、正则化校验,一旦用户的输入超过了10个字符,则显示预先配置好的“不能超过10个字符”。
联动效果实现:
引擎初始化时读取json文件的第三部分conditions(联动条件),一旦表单中任一值发生变化则逐条执行condition中配置的条件,若条件成立则取该条件下的components中的组件属性,覆盖原components中对应的组件属性并重渲染,实现联动。参考图11,图11为表单联动规则配置,根据图11可以知道,在联动条件中,condition属性是触发条件,一旦select1的值变为”浙江省”,select2就不可见,input组件的标题变成了”关于浙江省的描述”。这里将对象{invisible::true}合并到了原来select2的属性,而对象{labelname:”关于...”}合并到了原来input组件的属性中,从而引起了这三个组件之间的联动,当然,components里可以放任意多个组件,所以可以实现多个组件对select1的输入做出相应。
另外因为conditions是个列表,像这样的联动条件可以配置无数个,从而形成表单中任意组件之间的联动。
实现联合校验:
当校验不再局限于单个组件,而是多个组件共同校验时,规则校验中的rules则不够用。例如,input2的值要大于inpu1,并且input3的值需要在input1和input2之间,因此本引擎还加入了联合校验的配置jointValidate。参考图12,图12为表单联合校验配置,根据图12可以知道,每当引擎监听到组件值变化,会首先校验组件自身的规则rules,如果自身的rules不通过则停止校验并显示错误文案;如果自身rules通过则逐条校验jointValidate列表项。如果该组件属于某一条联合校验则执行这条校验的校验函数validator,校验不通过则包含在datanames中的所有相关组件都会显示错误文案。其中,datanames中的任一组件值改变使得校验通过则所有datanames中组件的错误文案消失。
在本实施例中,通过表单配置文件(json文件)实现了表单的布局自动渲染,规则校验、联动效果,如此,避免了开发人员每写一个表单页都需要经历从UI开发到数据逻辑编写的完整前端开发流程,提高了表单生成的效率。
为了更好地说明本申请的表单渲染方法,参考图7,图7为表单渲染方法的操作流程示意图。
在本实施例中,表单引擎中设有一个独立的对象rootState,以该对象rootState作为总控制台角色,并基于对象rootState提供一个changeValue方法,当任一表单组件的数据发生变化都会主动触发changeValue方法通知所有表单组件有变化发生。例如,当用户在输入层中的某一表单组件输入内容后,对象rootState会计算整体表单数据,判断表单组件的数据是否发生变化,当任一表单组件的数据发生变化时,触发changeValue方法向所有表单组件发送表单数据发生变化的通知消息;当表单组件的数据没有发生变化时,则结束程序。
每个表单组件的DF计算层会在rootState上注册一个onChange方法用于接收通知消息并接收发生变化的表单数据,独立的DF计算层基于发生变化的表单数据计算组件属性是否发生变化,若组件属性发生变化,则将发生变化的数据发送至渲染层(真实DOM),由渲染层进行表单组件的重渲染操作;若组件属性没有发生变化,则无需进行组件的重渲染操作。其中,组件属性发生变化有两种情况:一种是由发生变化的表单数据直接引起的变化;另一种是由于联动组件的组件属性发生变化,导致与其联动的组件的组件属性也发生变化,例如,某一表单组件为省市选择器,当省份从北京改为浙江,此时,表单组件为市级选择器的组件属性也发生改变。
本实施例在引擎无法预知组件之间关系的前提下利用独立的DF计算层实现最小化的必要性重渲染,同时,实现了所有表单组件对全局变化的监听,又保证了无冗余的重渲染,在自动化实现组件联动关系的前提下保证了表单页的交互流畅性。
此外,本申请还提供一种终端,所述终端包括存储器、处理器及存储在存储器上并在所述处理器上运行表单渲染程序,所述处理器执行所述动物的表单渲染程序时实现如上所述表单渲染方法的步骤。
此外,本申请还提供一种表单渲染装置,所述装置包括存储器、处理器及存储在存储器上并在所述处理器上运行表单渲染程序,所述处理器执行所述动物的表单渲染程序时实现如上所述表单渲染方法的步骤。
此外,本申请还提供一种计算机可读存储介质,所述计算机可读存储介质上存储有表单渲染方法程序,所述表单渲染方法程序被处理器执行时实现如上所述表单渲染方法的步骤。
本领域内的技术人员应明白,本申请的实施例可提供为方法、系统、或计算机程序产品。因此,本申请可采用完全硬件实施例、完全软件实施例、或结合软件和硬件方面的实施例的形式。而且,本申请可采用在一个或多个其中包含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘存储器、CD-ROM、光学存储器等)上实施的计算机程序产品的形式。
本申请是参照根据本申请实施例的方法、设备(系统)、和计算机程序产品的流程图和/或方框图来描述的。应理解可由计算机程序指令实现流程图和/或方框图中的每一流程和/或方框、以及流程图和/或方框图中的流程和/或方框的结合。可提供这些计算机程序指令到通用计算机、专用计算机、嵌入式处理机或其他可编程数据处理设备的处理器以产生一个机器,使得通过计算机或其他可编程数据处理设备的处理器执行的指令产生用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的装置。
这些计算机程序指令也可存储在能引导计算机或其他可编程数据处理设备以特定方式工作的计算机可读存储器中,使得存储在该计算机可读存储器中的指令产生包括指令装置的制造品,该指令装置实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能。
这些计算机程序指令也可装载到计算机或其他可编程数据处理设备上,使得在计算机或其他可编程设备上执行一系列操作步骤以产生计算机实现的处理,从而在计算机或其他可编程设备上执行的指令提供用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的步骤。
应当注意的是,在权利要求中,不应将位于括号之间的任何参考符号构造成对权利要求的限制。单词“包含”不排除存在未列在权利要求中的部件或步骤。位于部件之前的单词“一”或“一个”不排除存在多个这样的部件。本申请可以借助于包括有若干不同部件的硬件以及借助于适当编程的计算机来实现。在列举了若干装置的单元权利要求中,这些装置中的若干个可以是通过同一个硬件项来具体体现。单词第一、第二、以及第三等的使用不表示任何顺序。可将这些单词解释为名称。
尽管已描述了本申请的可选实施例,但本领域内的技术人员一旦得知了基本创造性概念,则可对这些实施例作出另外的变更和修改。所以,所附权利要求意欲解释为包括可选实施例以及落入本申请范围的所有变更和修改。
显然,本领域的技术人员可以对本申请进行各种改动和变型而不脱离本申请的精神和范围。这样,倘若本申请的这些修改和变型属于本申请权利要求及其等同技术的范围之内,则本申请也意图包含这些改动和变型在内。

Claims (9)

1.一种表单渲染方法,其特征在于,所述方法包括:
在接收到表单数据发生变化的通知消息时,获取发生变化的表单数据;
确定虚拟独立层中表单组件的组件属性是否包括第一组件属性,每个所述表单组件对应有一个虚拟独立层;
若包括所述第一组件属性,则将发生变化的表单数据作为参数执行所述第一组件属性中的程序;
根据执行结果确定所述表单组件的组件属性是否发生变化,其中,当所述执行结果与预设结果不一致时,确定所述组件属性发生变化;
若所述组件属性发生变化,则根据发生变化的表单数据对所述表单组件进行重渲染。
2.如权利要求1所述的表单渲染方法,其特征在于,所述根据发生变化的表单数据确定虚拟独立层中表单组件的组件属性是否发生变化的步骤,还包括:
若所述虚拟独立层中表单组件的组件属性不包括所述第一组件属性,则将发生变化的表单数据与预设数据进行比较;
根据比较结果确定所述表单组件的组件属性是否发生变化,其中,当所述比较结果为发生变化的表单数据与所述预设数据不一致时,确定所述组件属性发生变化。
3.如权利要求1所述的表单渲染方法,其特征在于,所述根据发生变化的表单数据对所述表单组件进行重渲染的步骤包括:
将发生变化的表单数据发送至所述表单组件的渲染层,以使所述渲染层根据发生变化的表单数据对所述表单组件进行重渲染。
4.一种表单渲染方法,其特征在于,所述方法包括:
获取表单配置文件,为所述表单配置文件中的每个表单组件设置虚拟独立层,每个所述表单组件对应有一个虚拟独立层;
在检测到表单数据发生变化时,向每个所述表单组件的虚拟独立层发送表单数据发生变化的通知消息,以使所述虚拟独立层确定所述虚拟独立层中表单组件的组件属性是否包括第一组件属性;若包括所述第一组件属性,则将发生变化的表单数据作为参数执行所述第一组件属性中的程序;根据执行结果确定所述表单组件的组件属性是否发生变化,其中,当所述执行结果与预设结果不一致时,确定所述组件属性发生变化,在发生变化时执行表单组件的重渲染动作。
5.如权利要求4所述的表单渲染方法,其特征在于,所述获取表单配置文件的步骤之后,包括:
对所述表单配置文件进行解析得到表单配置信息,根据所述表单配置信息获取所述表单组件的标识信息;
根据所述表单组件的标识信息从组件列表中获取表单组件;
根据所述表单组件对表单进行渲染。
6.如权利要求4所述的表单渲染方法,其特征在于,对所述表单组件进行校验的方法包括:
在进行单个表单组件校验时,根据校验函数对组件值发生变化的表单组件进行校验;
在进行至少两个表单组件联合校验时,根据校验函数对组件值发生变化的第一表单组件进行校验;
在所述第一表单组件校验成功时,对第二表单组件进行校验,其中,所述第二表单组件是所述第一表单组件的子表单组件。
7.一种终端,其特征在于,所述终端包括存储器、处理器及存储在存储器上并在所述处理器上运行表单渲染程序,所述处理器执行所述表单渲染程序时实现如权利要求1至6中任一项所述的方法的步骤。
8.一种表单渲染装置,其特征在于,所述装置包括存储器、处理器及存储在存储器上并在所述处理器上运行表单渲染程序,所述处理器执行所述表单渲染程序时实现如权利要求1至6中任一项所述的方法的步骤。
9.一种计算机可读存储介质,其特征在于,所述计算机可读存储介质上存储有表单渲染程序,所述表单渲染程序被处理器执行时实现如权利要求1至6中任一项所述的方法的步骤。
CN202110669182.1A 2021-06-16 2021-06-16 表单渲染方法、终端、装置和计算机可读存储介质 Active CN113419801B (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202110669182.1A CN113419801B (zh) 2021-06-16 2021-06-16 表单渲染方法、终端、装置和计算机可读存储介质

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202110669182.1A CN113419801B (zh) 2021-06-16 2021-06-16 表单渲染方法、终端、装置和计算机可读存储介质

Publications (2)

Publication Number Publication Date
CN113419801A CN113419801A (zh) 2021-09-21
CN113419801B true CN113419801B (zh) 2022-12-27

Family

ID=77788778

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202110669182.1A Active CN113419801B (zh) 2021-06-16 2021-06-16 表单渲染方法、终端、装置和计算机可读存储介质

Country Status (1)

Country Link
CN (1) CN113419801B (zh)

Families Citing this family (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN113741898B (zh) * 2021-11-08 2022-02-25 深圳市明源云采购科技有限公司 表单生成方法、装置及设备

Citations (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
WO2011066472A1 (en) * 2009-11-25 2011-06-03 Framehawk, Inc. Methods for interfacing with a virtualized computing service over a network using a lightweight client
WO2017035975A1 (zh) * 2015-08-31 2017-03-09 百度在线网络技术(北京)有限公司 地图信息的显示方法、装置和存储介质
US10447728B1 (en) * 2015-12-10 2019-10-15 Fireeye, Inc. Technique for protecting guest processes using a layered virtualization architecture

Family Cites Families (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN103049521B (zh) * 2012-12-19 2015-11-11 广东电子工业研究院有限公司 可实现多属性复合条件查询的虚拟表索引系统及方法
CN108846087A (zh) * 2018-06-12 2018-11-20 恒生电子股份有限公司 一种页面渲染方法、装置、终端及服务器
CN111178012A (zh) * 2019-12-03 2020-05-19 腾讯云计算(北京)有限责任公司 一种表单渲染方法、装置、设备及存储介质

Patent Citations (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
WO2011066472A1 (en) * 2009-11-25 2011-06-03 Framehawk, Inc. Methods for interfacing with a virtualized computing service over a network using a lightweight client
WO2017035975A1 (zh) * 2015-08-31 2017-03-09 百度在线网络技术(北京)有限公司 地图信息的显示方法、装置和存储介质
US10447728B1 (en) * 2015-12-10 2019-10-15 Fireeye, Inc. Technique for protecting guest processes using a layered virtualization architecture

Also Published As

Publication number Publication date
CN113419801A (zh) 2021-09-21

Similar Documents

Publication Publication Date Title
CN110928772B (zh) 一种测试方法及装置
US20170277625A1 (en) Generating annotated screenshots based on automated tests
CN108292231B (zh) 从数据生成应用的方法和系统
US8336030B1 (en) System and method for coding standard testing
US20150067652A1 (en) Module Specific Tracing in a Shared Module Environment
Mahajan et al. Automated repair of mobile friendly problems in web pages
EP3074863B1 (en) System and method for testing data representation for different mobile devices
WO2021184725A1 (zh) 用户界面测试方法、装置、存储介质及计算机设备
US20140075371A1 (en) System and method for model based session management
US20140372985A1 (en) API Rules Verification Platform
US20140074452A1 (en) System and method for automatic modeling of an application
JP4023803B2 (ja) ウェブアプリケーション開発支援装置、データ処理方法及びプログラム
US10705949B2 (en) Evaluation of library test suites using mutation testing
CN113076104A (zh) 页面生成方法、装置、设备及存储介质
US10452723B2 (en) Detecting malformed application screens
Walsh et al. Automatically identifying potential regressions in the layout of responsive web pages
CN113868126A (zh) 应用调试方法、装置、设备的存储介质
Xu et al. Guider: Gui structure and vision co-guided test script repair for android apps
US9092111B2 (en) Capturing information on a rendered user interface including user activatable content
CN113419801B (zh) 表单渲染方法、终端、装置和计算机可读存储介质
CN114265657A (zh) 一种小程序的页面显示方法及装置
CN113094776B (zh) 可视化组件模型数据构建的方法、系统及电子设备
US8671396B2 (en) Dynamic interface reduction for software model checking
KR102014500B1 (ko) 드릴-다운 슬라이드 프리젠테이션 콘텐츠 생성 방법 및 장치, 드릴-다운 슬라이드 프리젠테이션 콘텐츠 배포 방법 및 장치, 드릴-다운 슬라이드 프리젠테이션 콘텐츠 재생 방법 및 장치, 및 드릴-다운 프리젠테이션 콘텐츠 배포 및 재생 시스템
CN116257226A (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
GR01 Patent grant
GR01 Patent grant