一种基于组件化模板的web快速开发方法及系统技术方案

本发明专利技术公开了一种基于组件化模板的web快速开发方法及系统，方法包括：通过拖拽式设计页面，配置各组件的关系及事件；对控件片段进行渲染，并基于控件生命周期进行初始化。本发明专利技术能够基于组件化模板技术实现快速开发，可实现不断积累、最小粒度的复用、持续迭代升级，以及灵活组装。

【技术实现步骤摘要】
一种基于组件化模板的web快速开发方法及系统
本专利技术涉及web(WorldWideWeb，全球广域网)快速开发
，尤其涉及一种基于组件化模板的web快速开发方法及系统。
技术介绍
目前在web开发过程中，在做配置时，主要是基于固定逻辑，然后进行编排，没有对前端的组件抽象。比如，配置一个表单的增删改功能，现有技术基本是基于固定模式进行类似代码生成的方法，这种方法无法满足用户的复杂需求，比如按钮摆放位置，添加额外的功能，对页面复杂的关系也无法配置。因此，如何实现web的快速开发是一项亟待解决的问题。
技术实现思路
有鉴于此，本专利技术提供了一种基于组件化模板的web快速开发方法，能够基于组件化模板技术实现快速开发，可实现不断积累、最小粒度的复用、持续迭代升级，以及灵活组装。本专利技术提供了一种基于组件化模板的web快速开发方法，包括：通过拖拽式设计页面，配置各组件的关系及事件；对控件片段进行渲染，并基于控件生命周期进行初始化。优选地，所述通过拖拽式设计页面，配置各组件的关系及事件，包括：管理数据实体，以及生成相应的调用接口；通过拖拽组件模板组装页面、绑定数据源以及页面逻辑；管理维护控件基本信息。优选地，所述对控件片段进行渲染，并基于控件生命周期进行初始化，包括：基于页面拖拽配置的可扩展标记语言组件关系查找到相应的控件片段进行渲染，并基于控件生命周期进行初始化。优选地，所述控件基本信息包括：渲染模板、控件脚本、控件属性以及插件安装。一种基于组件化模板的web快速开发系统，包括：设计器，用于通过拖拽式设计页面，配置各组件的关系及事件；运行时，用于对控件片段进行渲染，并基于控件生命周期进行初始化。优选地，所述设计器包括：数据源、界面设计器和控件模板，其中：所述数据源，用于管理数据实体，以及生成相应的调用接口；所述界面设计器，用于通过拖拽组件模板组装页面、绑定数据源以及页面逻辑；所述控件模板，用于管理维护控件基本信息。优选地，所述运行时具体用于：基于页面拖拽配置的可扩展标记语言组件关系查找到相应的控件片段进行渲染，并基于控件生命周期进行初始化。优选地，所述控件基本信息包括：渲染模板、控件脚本、控件属性以及插件安装。综上所述，本专利技术公开了一种基于组件化模板的web快速开发方法，当需要对web进行开发时，首先通过拖拽式设计页面，配置各组件的关系及事件，然后对控件片段进行渲染，并基于控件生命周期进行初始化。本专利技术能够基于组件化模板技术实现快速开发，可实现不断积累、最小粒度的复用、持续迭代升级，以及灵活组装。附图说明为了更清楚地说明本专利技术实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本专利技术的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。图1为本专利技术公开的一种基于组件化模板的web快速开发方法实施例1的方法流程图；图2为本专利技术公开的一种基于组件化模板的web快速开发方法实施例2的方法流程图；图3为本专利技术公开的一种基于组件化模板的web快速开发方法实施例3的方法流程图；图4为本专利技术公开的一种基于组件化模板的web快速开发系统实施例1的结构示意图；图5为本专利技术公开的一种基于组件化模板的web快速开发系统实施例2的结构示意图；图6为本专利技术公开的一种基于组件化模板的web快速开发系统实施例3的结构示意图。具体实施方式下面将结合本专利技术实施例中的附图，对本专利技术实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本专利技术一部分实施例，而不是全部的实施例。基于本专利技术中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本专利技术保护的范围。如图1所示，为本专利技术公开的一种基于组件化模板的web快速开发方法实施例1的方法流程图，所述方法可以包括以下步骤：S101、通过拖拽式设计页面，配置各组件的关系及事件；当需要实现web开发时，首先进行组件配置、数据源配置，并通过拖拽完成页面设计，绑定数据源以及对页面关系进行设置。S102、对控件片段进行渲染，并基于控件生命周期进行初始化。然后，对控件片段进行渲染，并根据控件生命周期进行初始化，完成整个页面渲染过程。综上所述，在上述实施例中，当需要对web进行开发时，首先通过拖拽式设计页面，配置各组件的关系及事件，然后对控件片段进行渲染，并基于控件生命周期进行初始化。本专利技术能够基于组件化模板技术实现快速开发，可实现不断积累、最小粒度的复用、持续迭代升级，以及灵活组装。如图2所示，为本专利技术公开的一种基于组件化模板的web快速开发方法实施例2的方法流程图，所述方法可以包括以下步骤：S201、管理数据实体，以及生成相应的调用接口；当需要实现web开发时，首先进行组件配置、数据源配置，并通过拖拽完成页面设计，绑定数据源以及对页面关系进行设置。具体的，首先通过数据源管理数据实体，以及通过设计器配置自动生成相应的调用接口。其中，在数据实体管理时，主要是管理抽象的数据。例如，如是数据库，对应的是数据库的字段信息；如是excel，对应的是excel列信息。在实体配置完之后，会提供实体的操作接口，所述接口为逻辑接口。S202、通过拖拽组件模板组装页面、绑定数据源以及页面逻辑；然后，通过界面设计器通过拖拽组件模板组装界面、绑定数据源以及页面逻辑。其中，组件抽象有自己的属性及生命周期，如表格控件的属性就有初始化数据源，数据源依赖参数、分页信息等。其中，页面逻辑包括控件的显隐、级联、按钮事件、文本事件、表格联动等。S203、管理维护控件基本信息；然后，管理维护控件基本信息，其中，控件基本信息有：渲染模板、控件脚本、控件属性以及插件安装。具体的，渲染模板是由代码片段构成，并能通过参数配置生成最终效果；控件脚本是对控件的生命周期进行的抽象，并可在运行时执行的脚本，如控件的初始化、销毁、值变化事件等，这些抽象的动作可由设计界面进行关系串联，以达到页面交互的目的；控件属性是维护各个组件的特有属性，如宽，高，数据源等；插件安装是配置控件所依赖的三方组件。S204、对控件片段进行渲染，并基于控件生命周期进行初始化。然后，对控件片段进行渲染，并根据控件生命周期进行初始化，完成整个页面渲染过程。综上所述，在上述实施例中，当需要对web进行开发时，首先管理数据实体，以及生成相应的调用接口；通过拖拽组件模板组装页面、绑定数据源以及页面逻辑；管理维护控件基本信息，然后对控件片段进行渲染，并基于控件生命周期进行初始化。本专利技术能够基于组件化模板技术实现快速开发，可实现不断积累、最小粒度的复用、持续迭代升级，本文档来自技高网...

【技术保护点】
1.一种基于组件化模板的web快速开发方法，其特征在于，包括：/n通过拖拽式设计页面，配置各组件的关系及事件；/n对控件片段进行渲染，并基于控件生命周期进行初始化。/n

【技术特征摘要】
1.一种基于组件化模板的web快速开发方法，其特征在于，包括：
通过拖拽式设计页面，配置各组件的关系及事件；
对控件片段进行渲染，并基于控件生命周期进行初始化。


2.根据权利要求1所述的方法，其特征在于，所述通过拖拽式设计页面，配置各组件的关系及事件，包括：
管理数据实体，以及生成相应的调用接口；
通过拖拽组件模板组装页面、绑定数据源以及页面逻辑；
管理维护控件基本信息。


3.根据权利要求2所述的方法，其特征在于，所述对控件片段进行渲染，并基于控件生命周期进行初始化，包括：
基于页面拖拽配置的可扩展标记语言组件关系查找到相应的控件片段进行渲染，并基于控件生命周期进行初始化。


4.根据权利要求3所述的方法，其特征在于，所述控件基本信息包括：渲染模板、控件脚本、控件属性以及插件安装。


5.一...

【专利技术属性】
技术研发人员：杨志鹏，孙敏杰，陈宝珍，汪晓旸，李慧明，刘海平，
申请(专利权)人：北京恒华伟业科技股份有限公司，
类型：发明
国别省市：北京;11