基于模板化前端页面生成的方法及系统技术方案

本申请提出了一种基于模板化前端页面生成的方法及系统。方法包括：获取页面编辑信息，所述页面编辑信息是根据用户信息编辑得到的变量信息；获取初始组件；根据所述页面编辑信息生成目标配置；根据所述目标配置对所述初始组件的初始配置进行编辑，得到目标组件；根据所述目标组件渲染生成目标前端页面。本申请支持以模板套用形式减少前端页面重复开发，解决人力资源消耗困局；形成规范定义与模板形式，解决代码不规范出错率高效率低的问题；支持快速生成页面，解决营销快速变化的业务需求响应不及时问题。不及时问题。不及时问题。

【技术实现步骤摘要】
基于模板化前端页面生成的方法及系统


[0001]本申请涉及计算机前端
，具体涉及一种基于模板化前端页面生成的方法及系统。

技术介绍

[0002]随着互联网和HTML(Hyper Text Markup Language，超文本标记语言)技术的飞速发展，web(World Wide Web，全球广域网)应用在整个软件和互联网市场中占据的份额越来越大。在市场营销中，广告投放这块，需要快速的生成前端页面，而且可能随时地进行修改，在这个页面开发过程中充斥着许多简单却重复繁琐的工作。如何更快地把前端页面原型图转化成对应的前端页面一直是前端开发者们关注的问题。前端页面作为软件开发中的重要一环，页面效果很大程度上直接关系到客户的使用体验。
[0003]目前的前端页面生成方法，一般都是采用开发人员手动的从头到尾的编写页面骨架结构、样式信息和动态交互(如点击、拖拽、移动)，部分情况下相似页面存在多次重复开发的现象，该过程中有任何变动都需要开发人员不断的修改调整，导致代码规范性不能统一，出错率高且效率较低，不能满足营销业务的快速投产，不能支撑营销快速变化的业务需求。另外，会严重消耗整个流程相关的资源(人力、物力)，甚至影响其他隐性的资源需求及规划。

技术实现思路

[0004]本申请提供一种基于模板化前端页面生成的方法及系统，以有助于改善现有技术问题。
[0005]第一方面，本申请提供一种基于模板化前端页面生成的方法，包括：获取页面编辑信息，所述页面编辑信息是根据用户信息编辑得到的变量信息；获取初始组件；根据所述页面编辑信息生成目标配置；根据所述目标配置对所述初始组件的初始配置进行编辑，得到目标组件；根据所述目标组件渲染生成目标前端页面。
[0006]在一些可选的实施方式中，所述初始组件的结构包括以下结构中的部分或全部：组件名称、组件核心配置、用于组件的逻辑判断、素材配置、用于配置文字和/或图片素材的链接、以及配置结构样式。
[0007]在一些可选的实施方式中，所述方法还包括：预先创建多个所述初始组件，所述初始组件所存储的位置为初始位置，所述初始组件包括布局类组件、数据展示类组件、表单类组件和混合功能类组件中的部分或全部。
[0008]在一些可选的实施方式中，所述获取至少一个初始组件包括：根据所述页面编辑信息，去组件库中进行匹配，所述组件库中存储所述初始组件；当没有匹配到与所述页面编辑信息对应的初始组件，舍弃所述页面编辑信息；当匹配到与所述页面编辑信息对应的初始组件，加载匹配到的所述初始组件。
[0009]第二方面，本申请提供一种基于模板化前端页面生成的装置，包括：获取模块，被
配置成：获取页面编辑信息，所述页面编辑信息是根据用户信息编辑得到的变量信息；以及，获取初始组件；处理模块，被配置成：根据所述页面编辑信息生成目标配置；根据所述目标配置对所述初始组件的初始配置进行编辑，得到目标组件；渲染模块，被配置成：根据所述目标组件渲染生成目标前端页面。
[0010]在一些可选的实施方式中，所述初始组件的结构包括以下结构中的部分或全部：组件名称、组件核心配置、用于组件的逻辑判断、素材配置、用于配置文字和/或图片素材的链接、以及配置结构样式。
[0011]在一些可选的实施方式中，所述装置还包括：创建模块，被配置成：预先创建多个所述初始组件，所述初始组件所存储的位置为初始位置，所述初始组件包括布局类组件、数据展示类组件、表单类组件和混合功能类组件中的部分或全部。
[0012]在一些可选的实施方式中，所述获取模块进一步被配置成：根据所述页面编辑信息，去组件库中进行匹配，所述组件库中存储所述初始组件；当没有匹配到与所述页面编辑信息对应的初始组件，舍弃所述页面编辑信息；当匹配到与所述页面编辑信息对应的初始组件，加载匹配到的所述初始组件。
[0013]第三方面，本申请提供一种计算机设备，包括：一个或多个处理器；存储装置，其上存储有一个或多个程序，当所述一个或多个程序被所述一个或多个处理器执行时，使得所述一个或多个处理器实现如第一方面所述的基于模板化前端页面生成的方法。
[0014]第四方面，本申请提供一种计算机可读存储介质，其上存储有计算机程序，所述计算机程序被一个或多个处理器执行时实现如第一方面所述的基于模板化前端页面生成的方法。
[0015]为了有助于改善现有技术存在的问题，本申请提出了一种基于模板化前端页面生成的方法及系统。本申请提出了一种更全面的处理方式，即基于模板化的前端页面生成的方法，按模板的类型进行了有效区分，同时，支持定义多套模板，按模板进行页面模板引入，再者，支持按照规范进行页面个性化结构适配，并且支持对模板类型、层级结构、灵活配置等有了更深层次的完善和扩展。总结起来，本申请实现的技术效果包括但不限于：
[0016]·
支持以模板套用形式减少前端页面重复开发，解决人力资源消耗困局；
[0017]·
形成规范定义与模板形式，解决代码不规范出错率高效率低的问题；
[0018]·
支持快速生成页面，解决营销快速变化的业务需求响应不及时问题。
附图说明
[0019]通过阅读参照以下附图所作的对非限制性实施例所作的详细描述，本申请的其它特征、目的和优点将会变得更明显。附图仅用于示出具体实施方式的目的，而并不认为是对本专利技术的限制。在附图中：
[0020]图1是根据本申请的基于模板化前端页面生成的方法的一个实施例的流程图；
[0021]图2是根据本申请的基于模板化前端页面生成的装置的一个实施例的结构图；
[0022]图3是根据本申请的计算机设备的一个实施例的硬件组成结构示意图。
具体实施方式
[0023]为了能够更加详尽地了解本申请实施例的特点与
技术实现思路
，下面结合附图对本申
请实施例的实现进行详细阐述，所附附图仅供参考说明之用，并非用来限定本申请实施例。
[0024]参考图1，图1是根据本申请的一种基于模板化前端页面生成的方法的一个实施例的流程图。如图1所示，本申请的基于模板化前端页面生成的方法可包括以下步骤：
[0025]步骤S0，创建多个初始组件，初始组件所存储的位置为初始位置。
[0026]初始组件可以为布局类组件、数据展示类组件、表单类组件和混合功能类组件中的一种或多种。这里可以将创建的初始组件存储到组件库中。
[0027]步骤S1，获取页面编辑信息，页面编辑信息是根据用户信息编辑得到的变量信息：
[0028]初始组件结构可包括：组件名称name、组件核心配置config、用于组件的逻辑判断、素材配置dataSource、用于配置文字/图片等素材的链接、以及配置结构样式style中的部分或全部。
[0029]步骤S2，根据页面编辑信息生成目标配置。
[0030]步骤S3，获取初始组件，根据目标配置对初始组件的初始配置进行编辑，得到目标组件。
[0031]这里，获取初始组件的具体步骤本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种基于模板化前端页面生成的方法，其特征在于，包括：获取页面编辑信息，所述页面编辑信息是根据用户信息编辑得到的变量信息；获取初始组件；根据所述页面编辑信息生成目标配置；根据所述目标配置对所述初始组件的初始配置进行编辑，得到目标组件；根据所述目标组件渲染生成目标前端页面。2.根据权利要求1所述的方法，其特征在于，所述初始组件的结构包括以下结构中的部分或全部：组件名称、组件核心配置、用于组件的逻辑判断、素材配置、用于配置文字和/或图片素材的链接、以及配置结构样式。3.根据权利要求1所述的方法，其特征在于，所述方法还包括：预先创建多个所述初始组件，所述初始组件所存储的位置为初始位置，所述初始组件包括布局类组件、数据展示类组件、表单类组件和混合功能类组件中的部分或全部。4.根据权利要求1所述的方法，其特征在于，所述获取至少一个初始组件包括：根据所述页面编辑信息，去组件库中进行匹配，所述组件库中存储所述初始组件；当没有匹配到与所述页面编辑信息对应的初始组件，舍弃所述页面编辑信息；当匹配到与所述页面编辑信息对应的初始组件，加载匹配到的所述初始组件。5.一种基于模板化前端页面生成的装置，其特征在于，包括：获取模块，被配置成：获取页面编辑信息，所述页面编辑信息是根据用户信息编辑得到的变量信息；以及，获取初始组件；处理模块，被配置成：根据所述页面编辑信息生成目标配置；根据所述目标配置对所述初始组件的初始配置进行编辑，得到目标组件...

【专利技术属性】
技术研发人员：李洪涛，
申请(专利权)人：中信百信银行股份有限公司，
类型：发明
国别省市：