CN113126986A - 基于动态数据的表单项渲染方法、系统、设备及存储介质 - Google Patents
基于动态数据的表单项渲染方法、系统、设备及存储介质 Download PDFInfo
- Publication number
- CN113126986A CN113126986A CN202110388436.2A CN202110388436A CN113126986A CN 113126986 A CN113126986 A CN 113126986A CN 202110388436 A CN202110388436 A CN 202110388436A CN 113126986 A CN113126986 A CN 113126986A
- Authority
- CN
- China
- Prior art keywords
- rendering
- data
- dynamic
- dynamic data
- data structure
- 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
Links
- 238000009877 rendering Methods 0.000 title claims abstract description 115
- 238000000034 method Methods 0.000 title claims abstract description 39
- 238000004590 computer program Methods 0.000 claims description 11
- 238000004806 packaging method and process Methods 0.000 claims description 6
- 238000011161 development Methods 0.000 abstract description 10
- 238000010586 diagram Methods 0.000 description 10
- 238000004891 communication Methods 0.000 description 9
- 238000012545 processing Methods 0.000 description 5
- 238000000926 separation method Methods 0.000 description 5
- 238000003672 processing method Methods 0.000 description 2
- 238000004458 analytical method Methods 0.000 description 1
- 238000013459 approach Methods 0.000 description 1
- 230000009286 beneficial effect Effects 0.000 description 1
- 238000013461 design Methods 0.000 description 1
- 238000005516 engineering process Methods 0.000 description 1
- 238000012986 modification Methods 0.000 description 1
- 230000004048 modification Effects 0.000 description 1
- 230000003287 optical effect Effects 0.000 description 1
- 230000002093 peripheral effect Effects 0.000 description 1
- 230000008092 positive effect Effects 0.000 description 1
- 239000007787 solid Substances 0.000 description 1
- 230000003068 static effect Effects 0.000 description 1
- 238000006467 substitution reaction Methods 0.000 description 1
- 230000001360 synchronised effect Effects 0.000 description 1
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
- G06F8/38—Creation or generation of source code for implementing user interfaces
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/957—Browsing optimisation, e.g. caching or content distillation
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/958—Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- General Engineering & Computer Science (AREA)
- Databases & Information Systems (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Software Systems (AREA)
- Data Mining & Analysis (AREA)
- Human Computer Interaction (AREA)
- Processing Or Creating Images (AREA)
Abstract
本发明公开了一种基于动态数据的表单项渲染方法、系统、设备及存储介质。上述方法包括：确定表单项的动态数据结构；通过前端页面根据业务需求将需要的表单项类型结合动态数据结构进行渲染拼接，得到数据渲染模板；通过前端页面将实际表单数据利用数据渲染模板进行渲染得到对应的动态表单项。本发明中所有的表单项渲染类型判断逻辑都在前端处理，能够提高开发接口的数据纯粹性，可以很好的满足动态数据的表单项渲染需求。
Description
技术领域
本发明涉及计算机技术领域，尤其涉及一种基于动态数据的表单项渲染方法、系统、设备及存储介质。
背景技术
目前在Web领域，网页的开发一般都是采用前后端分离模式，前端工程师负责页面结构及样式的书写，服务端负责提供数据，前端工程师通过Http请求，获取服务端数据，将其格式化后插入到页面结构中渲染出数据形成正式的网页。其中，Web代表网页，Http请求指从客户端到服务器端的请求消息。
在整个网页的开发过程中，前端渲染页面结构大致可以分为两种形式。一种是：数据结构固定，页面结构固定，前端只需要将从服务端获取的数据格式化以后直接插入到页面结构即可渲染出网页；另一种是：前端页面结构不确定，网页的结构依赖于服务端的数据结构和类型，这种形式相较于第一种固定网页结构插入数据的形式复杂了很多。
在网站开发过程中，针对于动态数据的渲染展示，前端开发人员如果按照一种数据结构开发一套前端展示结构，这样不仅很大的增加了工作量，也不一定能够全部满足动态数据的渲染展示。例如：某网站有50000个客户，每一个客户的基本信息状况都不会完全相同，假如有一个客户的基本信息中包括：电话，公司名称，邮编，地址，而另一个客户的基本信息中包括：公司名称，客户别名，行业类型，邮编等，这两个客户基本信息就有很多不同，如何在展示和编辑的时候完全满足每一个客户的基本信息数据结构，这就需要一种统一的基于动态数据的表单项渲染展示方法。
在现有技术中，通常是由服务端直接返回处理好的Html字符串结构，即在服务端根据数据结构和数据类型确定需要展示的表单项，组合成Html字符串，通过Http请求返回给前端，前端开发人员不需要处理数据逻辑，也不需要判断数据类型，直接将Http返回的Html字符串插入到页面结构中渲染出来即可。这种方式的缺点是服务端需要处理大量数据类型判断逻辑，拼接Html标签结构，而针对于Html标签拼接最好是前端开发人员来做，这些本不属于服务端的范畴，也违背了前后端开发分离的原则。
发明内容
本发明针对上述的在服务端使用动态数据拼接Html结构返回至前端造成服务端需处理的工作量过大且无法实现前后端开发分离的技术问题，提出一种基于动态数据的表单项渲染方法、系统、设备及存储介质。
第一方面，本申请实施例提供了一种基于动态数据的表单项渲染方法，包括：
数据结构确定步骤：确定表单项的动态数据结构；
模板获得步骤：通过前端页面根据业务需求将需要的表单项类型结合所述动态数据结构进行渲染拼接，得到数据渲染模板；
渲染步骤：通过所述前端页面将实际表单数据利用所述数据渲染模板进行渲染得到对应的动态表单项。
上述基于动态数据的表单项渲染方法，其中，所述数据结构确定步骤中，所述动态数据结构由所述前端页面与服务器端根据业务需求共同确定。
上述基于动态数据的表单项渲染方法，其中，所述动态数据结构中包含类型或限制条件的字段包括但不限于：en、cn、multi、dataType、required、value、readOnly。
上述基于动态数据的表单项渲染方法，其中，所述渲染步骤包括：
数据请求步骤：接收到所述前端页面发送的数据请求后，通过所述服务器端将需要展示的所述实际表单数据按照所述动态数据结构的格式进行封装并返回至所述前端页面；
表单项渲染步骤：通过所述前端页面将所述实际表单数据传入所述数据渲染模板中，并渲染出与所述实际表单数据对应的所述动态表单项。
第二方面，本申请实施例提供了一种基于动态数据的表单项渲染系统，包括：
数据结构确定模块：确定表单项的动态数据结构；
模板获得模块：通过前端页面根据业务需求将需要的表单项类型结合所述动态数据结构进行渲染拼接，得到数据渲染模板；
渲染模块：通过所述前端页面将实际表单数据利用所述数据渲染模板进行渲染得到对应的动态表单项。
上述基于动态数据的表单项渲染系统，其中，所述数据结构确定模块中，所述动态数据结构由所述前端页面与服务器端根据业务需求共同确定。
上述基于动态数据的表单项渲染系统，其中，所述动态数据结构中包含类型或限制条件的字段包括但不限于：en、cn、multi、dataType、required、value、readOnly。
上述基于动态数据的表单项渲染系统，其中，所述渲染模块包括：
数据请求单元：接收到所述前端页面发送的数据请求后，通过所述服务器端将需要展示的所述实际表单数据按照所述动态数据结构的格式进行封装并返回至所述前端页面；
表单项渲染单元：通过所述前端页面将所述实际表单数据传入所述数据渲染模板中，并渲染出与所述实际表单数据对应的所述动态表单项。
第三方面，本申请实施例提供了一种电子设备，包括存储器、处理器以及存储在所述存储器上并可在所述处理器上运行的计算机程序，所述处理器执行所述计算机程序时实现如上述第一方面所述的基于动态数据的表单项渲染方法。
第四方面，本申请实施例提供了一种计算机可读存储介质，其上存储有计算机程序，该程序被处理器执行时实现如上述第一方面所述的基于动态数据的表单项渲染方法。
与现有技术相比，本发明的优点和积极效果在于：
本发明提出一种针对不确定的前端页面结构，以及服务端动态数据和类型渲染页面结构的处理方法，可以减轻服务端使用动态数据拼接html结构的麻烦，所有的表单项渲染类型判断逻辑都在前端处理，能够提高开发接口的数据纯粹性，实现了前后端开发分离的原则，实现了数据能力更好地应用，可以很好的满足动态数据的表单项渲染需求。
附图说明
图1为本发明提供的一种基于动态数据的表单项渲染方法的步骤示意图；
图2为本发明提供的基于图1中步骤S3的流程图；
图3为本发明提供的动态数据结构示意图；
图4为本发明提供的各字段实际渲染表单项时具体对应的结构图；
图5为本发明提供的例1渲染的实际结构示意图；
图6为本发明提供的例2渲染的实际结构示意图；
图7为本发明提供的例3渲染的实际结构示意图；
图8为本发明提供的封装的数据结构示意图；
图9为本发明提供的一种基于动态数据的表单项渲染系统的框架图；
图10为根据本申请实施例的计算机设备的框架图。
其中，附图标记为：
11、数据结构确定模块；12、模板获得模块；13、渲染模块；131、数据请求单元；132、表单项渲染单元；81、处理器；82、存储器；83、通信接口；80、总线。
具体实施方式
为了使本申请的目的、技术方案及优点更加清楚明白，以下结合附图及实施例，对本申请进行描述和说明。应当理解，此处所描述的具体实施例仅仅用以解释本申请，并不用于限定本申请。基于本申请提供的实施例，本领域普通技术人员在没有作出创造性劳动的前提下所获得的所有其他实施例，都属于本申请保护的范围。
显而易见地，下面描述中的附图仅仅是本申请的一些示例或实施例，对于本领域的普通技术人员而言，在不付出创造性劳动的前提下，还可以根据这些附图将本申请应用于其他类似情景。此外，还可以理解的是，虽然这种开发过程中所作出的努力可能是复杂并且冗长的，然而对于与本申请公开的内容相关的本领域的普通技术人员而言，在本申请揭露的技术内容的基础上进行的一些设计，制造或者生产等变更只是常规的技术手段，不应当理解为本申请公开的内容不充分。
在本申请中提及“实施例”意味着，结合实施例描述的特定特征、结构或特性可以包含在本申请的至少一个实施例中。在说明书中的各个位置出现该短语并不一定均是指相同的实施例，也不是与其它实施例互斥的独立的或备选的实施例。本领域普通技术人员显式地和隐式地理解的是，本申请所描述的实施例在不冲突的情况下，可以与其它实施例相结合。
除非另作定义，本申请所涉及的技术术语或者科学术语应当为本申请所属技术领域内具有一般技能的人士所理解的通常意义。本申请所涉及的“一”、“一个”、“一种”、“该”等类似词语并不表示数量限制，可表示单数或复数。本申请所涉及的术语“包括”、“包含”、“具有”以及它们任何变形，意图在于覆盖不排他的包含；例如包含了一系列步骤或模块(单元)的过程、方法、系统、产品或设备没有限定于已列出的步骤或单元，而是可以还包括没有列出的步骤或单元，或可以还包括对于这些过程、方法、产品或设备固有的其它步骤或单元。本申请所涉及的“连接”、“相连”、“耦接”等类似的词语并非限定于物理的或者机械的连接，而是可以包括电气的连接，不管是直接的还是间接的。本申请所涉及的“多个”是指两个或两个以上。“和/或”描述关联对象的关联关系，表示可以存在三种关系，例如，“A和/或B”可以表示：单独存在A，同时存在A和B，单独存在B这三种情况。字符“/”一般表示前后关联对象是一种“或”的关系。本申请所涉及的术语“第一”、“第二”、“第三”等仅仅是区别类似的对象，不代表针对对象的特定排序。
下面结合附图所示的各实施方式对本发明进行详细说明，但应当说明的是，这些实施方式并非对本发明的限制，本领域普通技术人员根据这些实施方式所作的功能、方法、或者结构上的等效变换或替代，均属于本发明的保护范围之内。
在详细阐述本发明各个实施例之前，对本发明的核心发明思想予以概述，并通过下述若干实施例予以详细阐述。
本发明提出为了可以根据不同的动态数据，统一处理渲染出数据中包含的表单项，前端与服务端共同指定动态数据格式，前端根据动态的数据格式编写业务所有可能展示的表单项的渲染模板，并根据服务端传来的实际动态数据列表中每一项数据的类型和限制条件，在渲染模版中匹配渲染出所有动态数据列表中数据对应的表单项。
实施例一：
图1为本发明提供的一种基于动态数据的表单项渲染方法的步骤示意图。如图1所示，本实施例揭示了一种基于动态数据的表单项渲染方法(以下简称“方法”)的具体实施方式。
具体而言，本实施例所揭示的方法主要包括以下步骤：
步骤S1：确定表单项的动态数据结构；
具体而言，前端开发人员和服务端开发人员根据业务需求共同确定表单项的动态数据结构，如图3所示，其中，图3中对应字段的含义如下所示：
en代表表单项的英文label；cn代表表单项的的中文label；multi代表表单项是否为多值，其中，true代表多值，false代表单值；dataType代表表单项的类型；required代表表单项是否必填，其中，true代表必填，false代表不必填；value代表表单项的值；readOnly代表表单项是否只读，其中，true代表只读，false代表可以编辑。
步骤S2：通过前端页面根据业务需求将需要的表单项类型结合所述动态数据结构进行渲染拼接，得到数据渲染模板；
具体而言，前端开发人员根据具体的业务，将需求业务中所有可能渲染的表单项类型，结合第一步确定的数据类型中的en，cn，multi，datatype，required，value，readOnly字段全部渲染拼接好，得到数据渲染模板，用于在后续根据实际获取的数据，按照数据类型渲染出与之对应的表单项。具体的数据与表单项的匹配规则如下：
各字段实际渲染表单项的时候具体对应的结构如图4所示，具体而言，string代表表单项input，enum代表表单项select，date代表表单项datePicker时间精确到日期，textare代表表单项textarea，time代表表单项datePicker时间精确到秒，url代表表单项input，numer代表表单项input……
以下是图4中表单项的具体的渲染实例分析：
例1:企微昵称表单项的数据结构：
根据上述数据结构可以得到渲染的实际结构如图5所示。
例2：企业类型表单项数据结构：
根据上述数据结构可以得到渲染的实际结构如图6所示。
例3:创建日期表单项数据结构
根据上述数据结构可以得到渲染的实际结构如图7所示。
步骤S3：通过所述前端页面将实际表单数据利用所述数据渲染模板进行渲染得到对应的动态表单项。
参照图2所示，其中，所述步骤S3具体包括以下内容：
步骤S31：接收到所述前端页面发送的数据请求后，通过所述服务器端将需要展示的所述实际表单数据按照所述动态数据结构的格式进行封装并返回至所述前端页面；
步骤S32：通过所述前端页面将所述实际表单数据传入所述数据渲染模板中，并渲染出与所述实际表单数据对应的所述动态表单项。
具体而言，根据步骤S1确定的动态数据类型，服务端人员在前端进行数据请求时，根据业务需求将需要展示的信息表单项，封装成步骤S1确定的数据格式返回给前端开发人员，数据结构如图8所示。前端开发人员获取到服务端返回的数据列表以后，根据数据列表格式，将数据传入数据渲染模版中，渲染出业务所需的动态表单项。
本发明通过在前端编写业务所有可能展示的表单项模版，根据动态数据的类型和限制条件，在前端判断需要展示表单项的类型，值，是否必填，只读各种限制条件，从而使不同动态数据渲染出不同的表单项。
实施例二：
结合实施例一所揭示的一种基于动态数据的表单项渲染方法，本实施例揭示了一种基于动态数据的表单项渲染系统(以下简称“系统”)的具体实施示例。
参照图9所示，所述系统包括：
数据结构确定模块11：确定表单项的动态数据结构；
模板获得模块12：通过前端页面根据业务需求将需要的表单项类型结合所述动态数据结构进行渲染拼接，得到数据渲染模板；
渲染模块13：通过所述前端页面将实际表单数据利用所述数据渲染模板进行渲染得到对应的动态表单项。
具体而言，在所述数据结构确定模块11中，所述动态数据结构由所述前端页面与服务器端根据业务需求共同确定，所述动态数据结构中包含类型或限制条件的字段包括但不限于：en、cn、multi、dataType、required、value、readOnly。
具体而言，所述渲染模块13包括：
数据请求单元131：接收到所述前端页面发送的数据请求后，通过所述服务器端将需要展示的所述实际表单数据按照所述动态数据结构的格式进行封装并返回至所述前端页面；
表单项渲染单元132：通过所述前端页面将所述实际表单数据传入所述数据渲染模板中，并渲染出与所述实际表单数据对应的所述动态表单项。
本实施例所揭示的一种基于动态数据的表单项渲染系统与实施例一所揭示的一种基于动态数据的表单项渲染方法中其余相同部分的技术方案，请参实施例一所述，在此不再赘述。
实施例三：
结合图10所示，本实施例揭示了一种计算机设备的一种具体实施方式。计算机设备可以包括处理器81以及存储有计算机程序指令的存储器82。
具体地，上述处理器81可以包括中央处理器(CPU)，或者特定集成电路(Application Specific Integrated Circuit，简称为ASIC)，或者可以被配置成实施本申请实施例的一个或多个集成电路。
其中，存储器82可以包括用于数据或指令的大容量存储器。举例来说而非限制，存储器82可包括硬盘驱动器(Hard Disk Drive，简称为HDD)、软盘驱动器、固态驱动器(SolidState Drive，简称为SSD)、闪存、光盘、磁光盘、磁带或通用串行总线(Universal SerialBus，简称为USB)驱动器或者两个或更多个以上这些的组合。在合适的情况下，存储器82可包括可移除或不可移除(或固定)的介质。在合适的情况下，存储器82可在数据处理装置的内部或外部。在特定实施例中，存储器82是非易失性(Non-Volatile)存储器。在特定实施例中，存储器82包括只读存储器(Read-Only Memory，简称为ROM)和随机存取存储器(RandomAccess Memory，简称为RAM)。在合适的情况下，该ROM可以是掩模编程的ROM、可编程ROM(Programmable Read-Only Memory，简称为PROM)、可擦除PROM(Erasable ProgrammableRead-Only Memory，简称为EPROM)、电可擦除PROM(Electrically Erasable ProgrammableRead-Only Memory，简称为EEPROM)、电可改写ROM(Electrically Alterable Read-OnlyMemory，简称为EAROM)或闪存(FLASH)或者两个或更多个以上这些的组合。在合适的情况下，该RAM可以是静态随机存取存储器(Static Random-Access Memory，简称为SRAM)或动态随机存取存储器(Dynamic Random Access Memory，简称为DRAM)，其中，DRAM可以是快速页模式动态随机存取存储器(Fast Page Mode Dynamic Random Access Memory，简称为FPMDRAM)、扩展数据输出动态随机存取存储器(Extended Date Out Dynamic RandomAccess Memory，简称为EDODRAM)、同步动态随机存取内存(Synchronous Dynamic Random-Access Memory，简称SDRAM)等。
存储器82可以用来存储或者缓存需要处理和/或通信使用的各种数据文件，以及处理器81所执行的可能的计算机程序指令。
处理器81通过读取并执行存储器82中存储的计算机程序指令，以实现上述实施例中的任意一种基于动态数据的表单项渲染方法。
在其中一些实施例中，计算机设备还可包括通信接口83和总线80。其中，如图10所示，处理器81、存储器82、通信接口83通过总线80连接并完成相互间的通信。
通信接口83用于实现本申请实施例中各模块、装置、单元和/或设备之间的通信。通信端口83还可以实现与其他部件例如：外接设备、图像/数据采集设备、数据库、外部存储以及图像/数据处理工作站等之间进行数据通信。
总线80包括硬件、软件或两者，将计算机设备的部件彼此耦接在一起。总线80包括但不限于以下至少之一：数据总线(Data Bus)、地址总线(Address Bus)、控制总线(Control Bus)、扩展总线(Expansion Bus)、局部总线(Local Bus)。举例来说而非限制，总线80可包括图形加速接口(Accelerated Graphics Port，简称为AGP)或其他图形总线、增强工业标准架构(Extended Industry Standard Architecture，简称为EISA)总线、前端总线(Front Side Bus，简称为FSB)、超传输(Hyper Transport，简称为HT)互连、工业标准架构(Industry Standard Architecture，简称为ISA)总线、无线带宽(InfiniBand)互连、低引脚数(Low Pin Count，简称为LPC)总线、存储器总线、微信道架构(Micro ChannelArchitecture，简称为MCA)总线、外围组件互连(Peripheral Component Interconnect，简称为PCI)总线、PCI-Express(PCI-X)总线、串行高级技术附件(Serial AdvancedTechnology Attachment，简称为SATA)总线、视频电子标准协会局部(Video ElectronicsStandards Association Local Bus，简称为VLB)总线或其他合适的总线或者两个或更多个以上这些的组合。在合适的情况下，总线80可包括一个或多个总线。尽管本申请实施例描述和示出了特定的总线，但本申请考虑任何合适的总线或互连。
另外，结合上述实施例中的基于动态数据的表单项渲染方法，本申请实施例可提供一种计算机可读存储介质来实现。该计算机可读存储介质上存储有计算机程序指令；该计算机程序指令被处理器执行时实现上述实施例中的任意一种基于动态数据的表单项渲染方法。
以上所述实施例的各技术特征可以进行任意的组合，为使描述简洁，未对上述实施例中的各个技术特征所有可能的组合都进行描述，然而，只要这些技术特征的组合不存在矛盾，都应当认为是本说明书记载的范围。
综上所述，基于本发明的有益效果在于，本发明提出一种针对不确定的前端页面结构，以及服务端动态数据和类型渲染页面结构的处理方法，可以减轻服务端使用动态数据拼接html结构的麻烦，所有的表单项渲染类型判断逻辑都在前端处理，能够提高开发接口的数据纯粹性，实现了前后端开发分离的原则，可以很好的满足动态数据的表单项渲染需求。
以上所述实施例仅表达了本申请的几种实施方式，其描述较为具体和详细，但并不能因此而理解为对发明专利范围的限制。应当指出的是，对于本领域的普通技术人员来说，在不脱离本申请构思的前提下，还可以做出若干变形和改进，这些都属于本申请的保护范围。因此，本申请专利的保护范围应以所附权利要求为准。
Claims (10)
1.一种基于动态数据的表单项渲染方法，其特征在于，包括：
数据结构确定步骤：确定表单项的动态数据结构；
模板获得步骤：通过前端页面根据业务需求将需要的表单项类型结合所述动态数据结构进行渲染拼接，得到数据渲染模板；
渲染步骤：通过所述前端页面将实际表单数据利用所述数据渲染模板进行渲染得到对应的动态表单项。
2.根据权利要求1所述的一种基于动态数据的表单项渲染方法，其特征在于，所述数据结构确定步骤中，所述动态数据结构由所述前端页面与服务器端根据业务需求共同确定。
3.根据权利要求1所述的一种基于动态数据的表单项渲染方法，其特征在于，所述动态数据结构中包含类型或限制条件的字段包括但不限于：en、cn、multi、dataType、required、value、readOnly。
4.根据权利要求1所述的一种基于动态数据的表单项渲染方法，其特征在于，所述渲染步骤包括：
数据请求步骤：接收到所述前端页面发送的数据请求后，通过所述服务器端将需要展示的所述实际表单数据按照所述动态数据结构的格式进行封装并返回至所述前端页面；
表单项渲染步骤：通过所述前端页面将所述实际表单数据传入所述数据渲染模板中，并渲染出与所述实际表单数据对应的所述动态表单项。
5.一种基于动态数据的表单项渲染系统，其特征在于，包括：
数据结构确定模块：确定表单项的动态数据结构；
模板获得模块：通过前端页面根据业务需求将需要的表单项类型结合所述动态数据结构进行渲染拼接，得到数据渲染模板；
渲染模块：通过所述前端页面将实际表单数据利用所述数据渲染模板进行渲染得到对应的动态表单项。
6.根据权利要求5所述的一种基于动态数据的表单项渲染系统，其特征在于，所述数据结构确定模块中，所述动态数据结构由所述前端页面与服务器端根据业务需求共同确定。
7.根据权利要求5所述的一种基于动态数据的表单项渲染系统，其特征在于，所述动态数据结构中包含类型或限制条件的字段包括但不限于：en、cn、multi、dataType、required、value、readOnly。
8.根据权利要求5所述的一种基于动态数据的表单项渲染系统，其特征在于，所述渲染模块包括：
数据请求单元：接收到所述前端页面发送的数据请求后，通过所述服务器端将需要展示的所述实际表单数据按照所述动态数据结构的格式进行封装并返回至所述前端页面；
表单项渲染单元：通过所述前端页面将所述实际表单数据传入所述数据渲染模板中，并渲染出与所述实际表单数据对应的所述动态表单项。
9.一种电子设备，包括存储器、处理器以及存储在所述存储器上并可在所述处理器上运行的计算机程序，其特征在于，所述处理器执行所述计算机程序时实现如权利要求1至4中任一项所述的基于动态数据的表单项渲染方法。
10.一种计算机可读存储介质，其上存储有计算机程序，其特征在于，该程序被处理器执行时实现如权利要求1至4中任一项所述的基于动态数据的表单项渲染方法。
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202110388436.2A CN113126986A (zh) | 2021-04-12 | 2021-04-12 | 基于动态数据的表单项渲染方法、系统、设备及存储介质 |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202110388436.2A CN113126986A (zh) | 2021-04-12 | 2021-04-12 | 基于动态数据的表单项渲染方法、系统、设备及存储介质 |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN113126986A true CN113126986A (zh) | 2021-07-16 |
Family
ID=76776123
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202110388436.2A Pending CN113126986A (zh) | 2021-04-12 | 2021-04-12 | 基于动态数据的表单项渲染方法、系统、设备及存储介质 |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN113126986A (zh) |
Cited By (3)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN114003220A (zh) * | 2021-12-30 | 2022-02-01 | 思创数码科技股份有限公司 | 工作流模型实现方法、系统、可读存储介质及计算机设备 |
| CN114356472A (zh) * | 2021-12-03 | 2022-04-15 | 浙江臻善科技股份有限公司 | 一种系统界面差别化动态渲染的方法 |
| CN114925664A (zh) * | 2022-06-15 | 2022-08-19 | 北京搜房科技发展有限公司 | 信息录入方法及装置、存储介质及电子设备 |
Citations (6)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN104572131A (zh) * | 2015-02-04 | 2015-04-29 | 浪潮软件股份有限公司 | 一种业务表单配置的方法和装置 |
| CN106033471A (zh) * | 2015-03-20 | 2016-10-19 | 阿里巴巴集团控股有限公司 | 一种处理表单的方法和装置 |
| CN110472207A (zh) * | 2018-05-10 | 2019-11-19 | 北京京东尚科信息技术有限公司 | 表单生成方法和装置 |
| CN111079382A (zh) * | 2019-11-29 | 2020-04-28 | 苏宁云计算有限公司 | 基于mvvm模式的表单渲染方法及系统 |
| CN111178012A (zh) * | 2019-12-03 | 2020-05-19 | 腾讯云计算（北京）有限责任公司 | 一种表单渲染方法、装置、设备及存储介质 |
| CN112181410A (zh) * | 2020-09-11 | 2021-01-05 | 北京三快在线科技有限公司 | 一种视图层代码生成方法、装置、电子设备及存储介质 |
-
2021
- 2021-04-12 CN CN202110388436.2A patent/CN113126986A/zh active Pending
Patent Citations (6)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN104572131A (zh) * | 2015-02-04 | 2015-04-29 | 浪潮软件股份有限公司 | 一种业务表单配置的方法和装置 |
| CN106033471A (zh) * | 2015-03-20 | 2016-10-19 | 阿里巴巴集团控股有限公司 | 一种处理表单的方法和装置 |
| CN110472207A (zh) * | 2018-05-10 | 2019-11-19 | 北京京东尚科信息技术有限公司 | 表单生成方法和装置 |
| CN111079382A (zh) * | 2019-11-29 | 2020-04-28 | 苏宁云计算有限公司 | 基于mvvm模式的表单渲染方法及系统 |
| CN111178012A (zh) * | 2019-12-03 | 2020-05-19 | 腾讯云计算（北京）有限责任公司 | 一种表单渲染方法、装置、设备及存储介质 |
| CN112181410A (zh) * | 2020-09-11 | 2021-01-05 | 北京三快在线科技有限公司 | 一种视图层代码生成方法、装置、电子设备及存储介质 |
Non-Patent Citations (1)
| Title |
|---|
| WEIXIN_34223655: "使用Vue渲染可配置表单--记一次问卷平台项目", pages 1 - 2, Retrieved from the Internet <URL:https://blog.csdn.net/weixin_34223655/article/details> * |
Cited By (3)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN114356472A (zh) * | 2021-12-03 | 2022-04-15 | 浙江臻善科技股份有限公司 | 一种系统界面差别化动态渲染的方法 |
| CN114003220A (zh) * | 2021-12-30 | 2022-02-01 | 思创数码科技股份有限公司 | 工作流模型实现方法、系统、可读存储介质及计算机设备 |
| CN114925664A (zh) * | 2022-06-15 | 2022-08-19 | 北京搜房科技发展有限公司 | 信息录入方法及装置、存储介质及电子设备 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN113126986A (zh) | 基于动态数据的表单项渲染方法、系统、设备及存储介质 | |
| US8468145B2 (en) | Indexing of URLs with fragments | |
| US20150019956A1 (en) | Method and device for displaying a web page | |
| CN108717437B (zh) | 搜索结果展示方法、装置及存储介质 | |
| CN112667415B (zh) | 数据调用方法、装置、可读存储介质及电子设备 | |
| CN106648569B (zh) | 目标序列化实现方法和装置 | |
| CN113382083B (zh) | 一种网页截图方法和装置 | |
| CN110321504B (zh) | 一种页面处理方法及装置 | |
| CN112487766A (zh) | 一种文档标注方法、系统及计算机设备 | |
| CN113641873B (zh) | 数据处理方法、装置、电子设备及可读存储介质 | |
| CN113761871A (zh) | 富文本渲染方法、装置、电子设备以及存储介质 | |
| US10956659B1 (en) | System for generating templates from webpages | |
| CN114154474A (zh) | 数据导出方法、系统、计算机设备及可读存储介质 | |
| CN113434251B (zh) | 服务模块跨平台部署方法、装置及设备 | |
| CN112100121B (zh) | 计算装置、计算设备以及可编程调度方法 | |
| CN113297453A (zh) | 一种网络请求响应方法、装置、电子设备及存储介质 | |
| CN113741878B (zh) | 基于GraphQL的接口构建方法、系统、电子设备及存储介质 | |
| WO2023082813A1 (zh) | 信息分享方法、装置、电子设备及存储介质 | |
| US20180157625A1 (en) | Method, system and apparatus for displaying an electronic document | |
| CN114117302A (zh) | 数据转换方法和装置 | |
| CN113987173A (zh) | 短文本分类方法、系统、电子设备及介质 | |
| CN113535338A (zh) | 用于数据接入的交互方法、系统、存储介质及电子设备 | |
| CN112149391A (zh) | 信息处理方法、信息处理装置、终端设备及存储介质 | |
| CN112667538A (zh) | 一种获取网卡标识号方法、系统、设备以及介质 | |
| CN113535130B (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 |