一种web页面开发方法、装置及系统制造方法及图纸

本公开关于一种web页面开发方法、装置、电子设备以及存储介质，用以至少解决相关技术中web页面开发更新过程需要大量重复的代码编写，每次修改后均需要重新编译上线，而导致web页面开发更新效率较低的问题，方法包括：根据接收到的web页面开发请求，确定待开发web页面的页面需求；根据所述页面需求，创建与所述待开发web页面对应的json文件，其中，所述json文件中各节点分别携带有对应的vue组件的唯一标识；根据所述json文件中各节点携带的vue组件的唯一标识，确定用于渲染所述待开发web页面的vue组件集合，利用所述vue组件集合中的各vue组件渲染生成web页面。

A web page development method, device and system

【技术实现步骤摘要】
一种web页面开发方法、装置及系统
本公开涉及计算机
，尤其涉及一种web页面开发方法、装置及系统。
技术介绍
随着互联网信息技术的飞速发展，终端设备的日益普及，而越来越多针对终端设备的应用程序(Application，APP)被开发出来，极大地丰富了人们的生活，且逐渐成为人们工作和生活中不可或缺的一部分。而同样由于APP与人们日常生活关系越来越紧密，从另外一方面也就导致用户对于APP页面展示的要求越来越高。为了可以给用户带来更好的使用体验，APP开发企业对于web页面的前端开发要求也变得越来越高。在应用程序开发过程中，前端开发是其中必不可少的一环。其中，前端开发是指创建网页页面或应用程序等前端界面呈现给用户的过程，其主要功能是把互联网产品的界面以一种更好、更便捷地方式呈现给用户，通过例如超文本标记语言(HyperTextMarkupLanguage，HTML)、层叠样式表(CascadingStyleSheet，CCS)工具、脚本语言(JavaScript)以及其他衍生出来的各种技术、框架、解决方案等，实现互联网产品的用户界面交互。传统的互联网产品的web页面开发过程主要包括：1、设计师绘制页面图像文件；2、人工分析该图像文件，确定页面样式布局；3、编写代码描述页面样式布局；4、将编写好的代码转换成图形处理器能够执行的页面配置信息，例如视图层代码，基于该页面配置信息可以实现在目标终端屏幕上显示与页面设计数据对应的页面。由此可见，现有的web页面开发过程，从页面设计到编写样式布局代码的过程中需要大量的人工操作，极大地降低了前端开发的效率。此外，目前大部分APP界面往往会根据当前节日、热点事件以及当前推广活动等对APP的显示页面进行一些字体、颜色、背景图以及文字的调整，该调整后的页面可能仅仅是为了在某一个节日活动中展示一天就结束了，而为了进行这样的页面调整，往往需要页面开发人员进行编写大量重复代码，且每次修改后都需要重新进行编译上线，大量重复乏味的工作一方面会消耗开发人员的工作热情，另外一方面还极大地降低了web页面的开发更新效率。由此可见，如何尽量减少web页面开发更新过程中大量重复的代码编写，避免每次修改后的编译上线，以尽可能地提高web页面的开发效率，成为现有技术亟待解决的问题。
技术实现思路
本公开提供一种web页面开发方法、装置及系统，以至少解决相关技术中web页面开发更新过程需要大量重复的代码编写，每次修改后均需要重新编译上线，而导致web页面开发更新效率较低的问题。本公开的技术方案如下：根据本公开实施例的第一方面，提供一种web页面开发方法，包括：根据接收到的web页面开发请求，确定待开发web页面的页面需求；根据所述页面需求，创建与所述待开发web页面对应的json文件，其中，所述json文件中各节点分别携带有对应的vue组件的唯一标识；根据所述json文件中各节点携带的vue组件的唯一标识确定用于渲染所述待开发web页面的vue组件集合，利用所述vue组件集合中的各vue组件渲染生成web页面。在一种实施方式中，确定与所述页面需求对应的vue组件集合，并确定所述vue集合中各vue组件的唯一标识；根据所述页面需求，确定所述vue集合中各vue组件对应的样式信息以及属性信息；根据所述vue组件集合中各vue组件的唯一标识，创建所述json文件中各节点的唯一标识，并将所述vue集合中各vue组件对应的样式信息以及属性信息，写入所述json文件的对应节点中。在一种实施方式中，根据所述json文件中各节点携带的vue组件的唯一标识，确定用于渲染所述待开发web页面的vue组件集合，利用所述vue组件集合中的各vue组件渲染生成web页面，包括：遍历所述json文件，根据所述json文件中各个节点的唯一标识，分别确定所述json文件中各个节点对应的vue组件；将所述json文件中各个节点对应的vue组件，确定为用于渲染所述待开发web页面的vue组件集合，利用所述vue组件集合中的各vue组件渲染生成web页面。在一种实施方式中，利用所述vue组件集合中的各vue组件渲染生成web页面，包括：根据所述json文件中各节点所包含的样式信息以及属性信息，分别确定所述vue组件集合中各vue组件对应的样式信息以及属性信息；所述vue组件集合中的各vue组件利用所述对应的样式信息以及属性信息，渲染生成web页面。在一种实施方式中，创建与所述待开发web页面对应的json文件，包括：根据所述待开发web页面查询参数的身份标识字段，创建与所述身份标识字段对应的json文件。根据本公开实施例的第二方面，提供一种web页面更新方法，包括：根据接收到的web页面更新请求，确定待更新web页面的更新需求；根据所述更新需求，修改与所述待更新web页面对应的json文件，其中，所述json文件中各节点分别携带有对应的vue组件的唯一标识；根据修改后的json文件中各节点携带的vue组件的唯一标识，确定用于更新所述待更新web页面的、更新后的vue组件集合，利用所述更新后的vue组件集合中的各更新后的vue组件渲染更新所述待更新web页面。在一种实施方式中，根据所述更新需求，修改与所述待更新web页面对应的json文件，包括：根据所述待更新web页面查询参数的身份标识字段，确定与所述待更新web页面对应的json文件；确定与所述更新需求对应的、更新后的vue组件集合，并确定所述更新后的vue集合中各更新后的vue组件的唯一标识；根据所述更新需求，确定所述更新后的vue组件集合中各更新后的vue组件对应的更新后的样式信息以及更新后的属性信息；根据所述更新后的vue组件集合，修改所述json文件中各节点的唯一标识，以使得修改后所述json文件中各节点的唯一标识与所述更新后vue组件集合中各更新后的vue组件的唯一标识对应；根据所述更新后的样式信息以及所述更新后的属性信息，修改所述json文件中各节点的包含的样式信息以及属性信息。在一种实施方式中，利用所述更新后的vue组件集合中的各更新后的vue组件渲染更新所述待更新web页面，包括：根据修改后的json文件中各节点所包含的样式信息以及属性信息，分别确定所述更新后的vue组件集合中各更新后的vue组件对应的样式信息以及属性信息；所述更新后的vue组件集合中的各更新后的vue组件利用所述对应的样式信息以及所述属性信息，渲染更新所述待更新web页面。根据本公开实施例的第三方面，提供一种web页面开发装置，包括：需求确定单元，被配置为执行根据接收到的web页面开发请求，确定待开发web页面的页面需求；文件创建单元，被配置为执行根据所述页面需求，创建与所述待开发web页面对应的json文件，其中，所述json文件中各节点分别携带有对应的vue组件的唯一标识；渲染单元，被配置为执行根据所述json文件中各节点携带的vue组件的唯一标识，确定用于渲染所述待开发本文档来自技高网...

【技术保护点】
1.一种web页面开发方法，其特征在于，包括：/n根据接收到的web页面开发请求，确定待开发web页面的页面需求；/n根据所述页面需求，创建与所述待开发web页面对应的json文件，其中，所述json文件中各节点分别携带有对应的vue组件的唯一标识；/n根据所述json文件中各节点携带的vue组件的唯一标识，确定用于渲染所述待开发web页面的vue组件集合，利用所述vue组件集合中的各vue组件渲染生成web页面。/n

【技术特征摘要】
1.一种web页面开发方法，其特征在于，包括：
根据接收到的web页面开发请求，确定待开发web页面的页面需求；
根据所述页面需求，创建与所述待开发web页面对应的json文件，其中，所述json文件中各节点分别携带有对应的vue组件的唯一标识；
根据所述json文件中各节点携带的vue组件的唯一标识，确定用于渲染所述待开发web页面的vue组件集合，利用所述vue组件集合中的各vue组件渲染生成web页面。


2.根据权利要求1所述的web页面开发方法，其特征在于，根据所述页面需求，创建与所述待开发web页面对应的json文件，包括：
确定与所述页面需求对应的vue组件集合，并确定所述vue集合中各vue组件的唯一标识；
根据所述页面需求，确定所述vue集合中各vue组件对应的样式信息以及属性信息；
根据所述vue组件集合中各vue组件的唯一标识，创建所述json文件中各节点的唯一标识，并将所述vue集合中各vue组件对应的样式信息以及属性信息，写入所述json文件的对应节点中。


3.根据权利要求2所述的web页面开发方法，其特征在于，根据所述json文件中各节点携带的vue组件的唯一标识，确定用于渲染所述待开发web页面的vue组件集合，利用所述vue组件集合中的各vue组件渲染生成web页面，包括：
遍历所述json文件，根据所述json文件中各个节点的唯一标识，分别确定所述json文件中各个节点对应的vue组件；
将所述json文件中各个节点对应的vue组件，确定为用于渲染所述待开发web页面的vue组件集合，利用所述vue组件集合中的各vue组件渲染生成web页面。


4.根据权利要求3所述的web页面开发方法，其特征在于，利用所述vue组件集合中的各vue组件渲染生成web页面，包括：
根据所述json文件中各节点所包含的样式信息以及属性信息，分别确定所述vue组件集合中各vue组件对应的样式信息以及属性信息；
所述vue组件集合中的各vue组件利用所述对应的样式信息以及属性信息，渲染生成web页面。


5.根据权利要求1所述的web页面开发方法，其特征在于，创建与所述待开发web页面对应的json文件，包括：
根据所述待开发web页面查询参数的身份标识字段，创建与所述身份标识字...

【专利技术属性】
技术研发人员：瞿靖坤，
申请(专利权)人：北京达佳互联信息技术有限公司，
类型：发明
国别省市：北京;11