CN114968228A - 页面搭建方法、装置、电子设备和计算机可读存储介质 - Google Patents

Abstract

本申请提供了一种页面搭建方法、装置、电子设备和计算机可读存储介质，其中，该方法包括：根据页面构建需求，确定组件树数据；根据所述组件树数据，生成初始页面；接收对所述初始页面的配置参数；以及根据所述配置参数和所述初始页面生成目标页面。可以提高页面构建的效率。

Description

页面搭建方法、装置、电子设备和计算机可读存储介质

技术领域

本申请涉及计算机技术领域，具体而言，涉及一种页面搭建方法、装置、电子设备和计算机可读存储介质。

背景技术

页面的构建方式，通常需要工程师通过编辑代码的方式逐一布局页面中所需要的组成部分，但是这种处理方式所需花费的人力资源较多，还可能存在工程师在编辑代码过程中出现一些错误，导致页面构建的效率也相对较低。

发明内容

本申请的目的在于提供一种页面搭建方法、装置、电子设备和计算机可读存储介质，改善现有的页面构建效率低的问题。

第一方面，本发明提供一种页面搭建方法，包括：根据页面构建需求，确定组件树数据；根据所述组件树数据，生成初始页面；接收对所述初始页面的配置参数；以及根据所述配置参数和所述初始页面生成目标页面。

在可选的实施方式中，所述根据页面构建需求，确定组件树数据，包括：根据页面构建需求，从组件库中选取多个目标组件；根据多个所述目标组件，构建组件树数据。

在可选的实施方式中，所述根据多个所述目标组件，构建组件树数据，包括：基于多个所述目标组件的配置需求以及多个所述目标组件的组件标签，构建组件树的组件树声明，所述配置需求包括多个所述目标组件的层级关系，所述组件树数据包括所述组件树声明。

在可选的实施方式中，所述方法还包括：获取组件更换请求；根据所述组件换请求，将当前页面中的第一组件替换为第二组件，所述第一组件为当前页面中所包含的一个组件；根据所述第二组件的组件标签，替换所述组件树声明中的所述第一组件的组件标签。

在可选的实施方式中，所述根据所述组件树数据，生成初始页面，包括：根据所述组件树声明，加载所述目标组件，并对渲染出组件，以生成初始页面。

在可选的实施方式中，所述根据所述组件树数据，生成初始页面，包括：根据所述组件树声明，加载所述目标组件，并对渲染出组件，以生成初始页面；对所述组件树中父组件和子组件的数据流和事件进行关联。

在可选的实施方式中，所述接收对所述初始页面的配置参数，包括：提供配置界面，所述配置界面中包括一个或多个配置框，所述配置框用于接收配置参数；获取所述配置框中接收到的配置参数。

在可选的实施方式中，所述根据页面构建需求，确定组件树数据，包括：根据页面构建需求，筛选出目标页面模板；根据所述目标页面模板，确定出组件树数据。

第二方面，本发明提供一种页面搭建装置，包括：第一确定模块，用于根据页面构建需求，确定组件树数据；第一生成模块，用于根据所述组件树数据，生成初始页面；接收模块，用于接收对所述初始页面的配置参数；以及第二生成模块，用于根据所述配置参数和所述初始页面生成目标页面。

第三方面，本发明提供一种电子设备，包括：处理器、存储器；所述存储器存储有所述处理器可执行的机器可读指令，当电子设备运行时，所述机器可读指令被所述处理器执行时执行如前述实施方式任意一项所述的方法的步骤。

第四方面，本发明提供一种计算机可读存储介质，该计算机可读存储介质上存储有计算机程序，该计算机程序被处理器运行时执行如前述实施方式任意一项所述的方法的步骤。

本申请实施例的有益效果是：通过上述页面构建方法，通过组件树数据可以将所需页面中的各组件关联起来，可以使页面中的各组件关联性更清楚；进一步地，根据该组件树数据的逻辑生成初始页面，可以使生成页面的顺序更清楚，也能够方便快速地实现各个组件的加载与生成，提高生成页面的效率。

附图说明

为了更清楚地说明本申请实施例的技术方案，下面将对实施例中所需要使用的附图作简单地介绍，应当理解，以下附图仅示出了本申请的某些实施例，因此不应被看作是对范围的限定，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他相关的附图。

图1为本申请实施例提供的电子设备的方框示意图；

图2为本申请实施例提供的页面构建方法的流程图；

图3为本申请实施例提供的页面构建装置的功能模块示意图。

具体实施方式

下面将结合本申请实施例中附图，对本申请实施例中的技术方案进行描述。

应注意到：相似的标号和字母在下面的附图中表示类似项，因此，一旦某一项在一个附图中被定义，则在随后的附图中不需要对其进行进一步定义和解释。同时，在本申请的描述中，术语“第一”、“第二”等仅用于区分描述，而不能理解为指示或暗示相对重要性。

随着计算机技术的发展，越来越多的信息通过互联网或计算机载体实现传播。经发明人研究了解到，不同公司的各线的飞速发展，更多的运营活动可以通过计算机显示页面中显示传播。为了使用活动页面能够更好地实现其需要的目的，活动页面需要具有一定的特定、内容需要更加丰富、内容的时效性好等。示例性地，活动页面的需求特点主要表现为：页面布局和业务逻辑较固定、每周甚至每天等不定时地存在此类活动页面需求、开发时间短上线时间紧、开发任务重复、消耗各方相关工作人员的沟通时间和人力。

基于现状的需求，需要一种能够方便用户操作的页面构建系统，使没有专业编程技术的人员也能够构建页面。但是当前的页面构建技术中，还是存在一些不足，例如：页面模板或者组件升级，bug修复，相应页面需要重新发布。

基于上述研究，本申请提供了一种页面构建方法，通过组件树数据可以实现快速构建页面，还可以基于需求适应性选出需要的组件，替换已构建的组件树中的组件，以实现对组件树的更新。下面通过一些实施例来描述本申请提供的页面构建方法。

为便于对本实施例进行理解，首先对执行本申请实施例所公开的页面构建方法的电子设备进行详细介绍。

如图1所示，是电子设备的方框示意图。电子设备100可以包括存储器111、存储控制器112、处理器113、外设接口114、输入输出单元115、显示单元116。本领域普通技术人员可以理解，图1所示的结构仅为示意，其并不对电子设备100的结构造成限定。例如，电子设备100还可包括比图1中所示更多或者更少的组件，或者具有与图1所示不同的配置。

上述的存储器111、存储控制器112、处理器113、外设接口114、输入输出单元115及显示单元116各元件相互之间直接或间接地电性连接，以实现数据的传输或交互。例如，这些元件相互之间可通过一条或多条通讯总线或信号线实现电性连接。上述的处理器113用于执行存储器中存储的可执行模块。

其中，存储器111可以是，但不限于，随机存取存储器(Random Access Memory，简称RAM)，只读存储器(Read Only Memory，简称ROM)，可编程只读存储器(ProgrammableRead-Only Memory，简称PROM)，可擦除只读存储器(Erasable Programmable Read-OnlyMemory，简称EPROM)，电可擦除只读存储器(Electric Erasable Programmable Read-OnlyMemory，简称EEPROM)等。其中，存储器111用于存储程序，所述处理器113在接收到执行指令后，执行所述程序，本申请实施例任一实施例揭示的过程定义的电子设备100所执行的方法可以应用于处理器113中，或者由处理器113实现。

上述的处理器113可能是一种集成电路芯片，具有信号的处理能力。上述的处理器113可以是通用处理器，包括中央处理器(Central Processing Unit，简称CPU)、网络处理器(Network Processor，简称NP)等；还可以是数字信号处理器(digital signalprocessor，简称DSP)、专用集成电路

(Application Specific Integrated Circuit，简称ASIC)、现场可编程门阵列(FPGA)或者其他可编程逻辑器件、分立门或者晶体管逻辑器件、分立硬件组件。可以实现或者执行本申请实施例中的公开的各方法、步骤及逻辑框图。通用处理器可以是微处理器或者该处理器也可以是任何常规的处理器等。

上述的外设接口114将各种输入/输出装置耦合至处理器113以及存储器111。在一些实施例中，外设接口114，处理器113以及存储控制器112可以在单个芯片中实现。在其他一些实例中，他们可以分别由独立的芯片实现。

上述的输入输出单元115用于提供给用户输入数据。所述输入输出单元115可以是，但不限于，鼠标和键盘等。

上述的显示单元116在电子设备100与用户之间提供一个交互界面(例如用户操作界面)或用于显示图像数据给用户参考。在本实施例中，所述显示单元可以是液晶显示器或触控显示器。若为触控显示器，其可为支持单点和多点触控操作的电容式触控屏或电阻式触控屏等。支持单点和多点触控操作是指触控显示器能感应到来自该触控显示器上一个或多个位置处同时产生的触控操作，并将该感应到的触控操作交由处理器进行计算和处理。

本实施例中，该显示单元116中可以显示用于构建页面所需的操作界面，该操作界面中可以包括多个选择按钮，用于选择不同的页面模板。该操作页面中也还可以包括多个配置框，该配置框用于接收用户输入的配置参数。

本实施例中的电子设备100可以用于执行本申请实施例提供的各个方法中的各个步骤。下面通过几个实施例详细描述页面构建方法的实现过程。

请参阅图2，是本申请实施例提供的页面构建方法的流程图。本实施例中的页面构建方法可以由图1所示的电子设备执行，该电子设备中可以预先存储有页面构建系统的各个模块，下面将对图2所示的具体流程进行详细阐述。

步骤210，根据页面构建需求，确定组件树数据。

该页面构建需求可以包括所需构建的页面的类型、页面所需功能、页面的性质等一项或多项需求。

该组件树数据中可以包括组件树声明，该组件树声明可以包括组件树中的各个组件标签。

在一个实施方式中，页面构建系统中可以存储有模板库，该模板库中可以预先存储不同类型的页面模板，每一个页面模板中可以设置有页面标签，该页标签可以用于唯一标记页面模板。每一个页面模板还可以配置有页面主题，该页面主题可以用于表示页面模板所属类型。该页面模板可以带有默认的配置参数，基于该默认的配置参数可以生成初始页面。

示例性地，页面所属类型可以包括：推荐类型、宣传类型等。

页面模板可以包含完整的业务逻辑，有助于快速生成业务页面。一个页面模板中可以包括多个组件。不同的页面模板适用于不同的业务功能，从模板库中选择合适的页面模板可以派生出初始页面，再对初始页面进行可视化编辑，该可以可视化编辑可以编辑生成配置参数，从而基于该配置参数生成目标业务页面。

步骤210可以被实施为：可以通过页面构建需求，筛选出目标页面模板；根据该目标页面模板，确定出组件树数据。

示例性地，可以根据该页面构建需求解析出所需构建的页面的类型，基于该所需构建的页面的类型在模板库中的多个页面模板中筛选出目标页面模板。

然后基于选出的目标页面模板所包含的组件，确定出组件树数据。该组件树数据可以包括组件树声明。该组件树声明中可以包括组件树所包含的组件节点、各个组件节点之间的关联关系等。各个组件节点之间的关联关系可以包括父组件、子节点等关联关系。

可选地，可以提供一显示界面，通过在显示界面接收用户输入的页面构建需求。

在另一种实施方式中，页面构建系统中可以预先存储有组件库，该组件库中可以包括多个不同功能的组件。每一个组件可以设置有组件标签，组件标签可以用于唯一标记组件。

示例性地，本实施例中的页面构建方法可以是基于前端框架react框架实现，页面构建方法也可以是基于前端框架Vue框架实现。当然，还可以基于其他前端框架，例如，Angular、Svelte、Alpine等。

组件可以是一个js对象。一个组件可以是对HTML(Hyper Text Markup Language，中文称：超文本标记语言)元素、元素布局和样式、业务逻辑的封装。

其中，通过组件封装业务逻辑，并通过组件属性(Props)向外暴露组件的配置字段。以一个推荐商品组件为例，该推荐商品组件提供了基本配置和业务配置，基本配置数据包含组件标题、副标题、标题颜色、布局(模块边距、商品卡片边距)、商品数量、角标图片、价格标图片等，业务配置包含原价、销量、推荐语等利益点信息控制。可以通过对商品的类目、维度选择来导入相应的配置参数，最终通过这些配置参数的传递，组件渲染出定制化的内容。

步骤210可以被实施为：根据页面构建需求，从组件库中选取多个目标组件；根据多个该目标组件，构建组件树数据。

进一步地，可以根据页面所需功能，确定出功能分布数据；根据该功能分布数据从页面构建系统中筛选出多个组件，以基于多个组件构建组件树数据。其中，该功能分布数据可以包括所需的功能，以及各个功能的层级关系。该层级关系可以包括各功能的依赖关系、关联关系等。

可选地，可以基于多个该目标组件的配置需求以及多个该目标组件的组件标签，构建组件树的组件树声明，该配置需求包括多个该目标组件的层级关系，该组件树数据包括该组件树声明。

步骤220，根据该组件树数据，生成初始页面。

在一种实施方式中，可以根据组件树声明动态渲染出组件，以生成初始页面。示例性地，可以根据该组件树声明，加载该目标组件，并对渲染出组件，以生成初始页面。

示例性地，可以通过组件树声明中的各个组件标签，获得获取组件名称返回对应组件。

示例性地，在生成初始页面时，可以只编辑组件树声明文件，然后将组件树声明传入提前打包好的页面中进行渲染。采用动态组件可以避免重新打包的耗时，快速生成新页面。

在另一种实施方式中，根据该组件树声明，加载该目标组件，并对渲染出组件，以生成初始页面；对该组件树中父组件和子组件的数据流和事件进行关联。

其中，组件树定义了组件间父子兄弟的层级关系，父子组件通过数据流和事件进行关联。例如，数据从父组件的State传递到子组件的Props；子组件的变更触发Event通知父组件。

在构建组件树数据时，可以设置组件树中的各组件的数据流。而不同组件的Props和State是异构的，在编辑组件树时，需要设置不同组件产生层级关系后对数据流的变化。

由于组件树中的各组件的层级关系不同会直接导致数据流的不同，因此，配置组件间数据依赖和组件间布局适配，通过设置组件的层级关系，可以使可视化编辑后的组件树正常渲染，以形成页面。

步骤230，接收对该初始页面的配置参数。

该配置参数可以实时配置的参数。可选地，可以提供配置界面，获取配置界面中的配置框中接收到的配置参数。

上述的配置界面中包括一个或多个配置框，该配置框用于接收配置参数。示例性地，每一个配置框可以对应有提示文本，该提示文本用于提示该配置框内可以配置的参数类型。

示例性地，该多个配置框可以形成类型表单，通过该类型表单能够实现通过与用户交互的方式获取配置参数，使用门槛相对更低，且该配置框实现的功能完善，容易使用，配置表单可以添加校验逻辑，避免填入错误的配置数据。

步骤240，根据该配置参数和该初始页面生成目标页面。

示例性地，可以根据该配置参数，重新渲染该初始页面，可以生成目标页面。

该目标页面可以是h5页面。

基于不同前端框架生成的页面则可以是不同类型的页面，例如，基于前端框架react框架实现的页面，则可以是react页面；再例如，基于前端框架Vue框架实现的页面，则可以是Vue页面。

通过上述方式可以，通过上述页面构建方法，通过组件树数据可以将所需页面中的各组件关联起来，可以使页面中的各组件关联性更清楚；进一步地，根据该组件树数据的逻辑生成初始页面，可以使生成页面的顺序更清楚，也能够方便快速地实现各个组件的加载与生成，提高生成页面的效率。

在一种实施方式中，页面由页面组件组合而成，在生成目标页面之前需要针对页面组件编辑和页面内容编辑。

其中，上述的步骤210和步骤220可以实现页面组件编辑。

本实施例的步骤210中，可以基于页面构建需求构建组件树，其中，该组件树表示使用组件化的方式来组织页面，页面可以认为是一颗组件树。其中，该组件树中的节点为组件，组件还可以包含子组件。

在页面组件编辑过程中，可以通过组件标签的组合来声明一颗组件树，并在打包时生成页面资源，在运行时加载页面资源渲染出页面。通过动态地给页面源码添加组件,然后重新打包生成页面。

在一种实施方式中，若需要对已经构建的组件树中的部分组件进行替换过，则可以通过以下步骤实现：获取组件更换请求；根据该组件换请求，将当前页面中的第一组件替换为第二组件；根据该第二组件的组件标签，替换该组件树声明中的该第一组件的组件标签。

该第一组件可以是当前页面中的一个组件，该第二组件可以是更换组件后的页面中的一个组件。

示例性地，可以仅仅将组件树声明中的第一组件的组件标签替换为第二组件的组件标签。

通过上述组件更换方式，可以实现组件的动态更新，依托于一些前端框架提供了动态组件的支持，然后可以根据组件树声明动态渲染出组件，而无需在构建前就定义好页面的组件树结构。对动态组件页面实现可视化组件编辑时，可以只编辑组件树声明文件，然后将组件树声明传入提前打包好的页面中进行渲染。采用动态组件可以避免重新打包的耗时，快速生成新页面。

为了方便用户更好的了解构建的页面的情况，在步骤240之后，还可以包括：预览目标页面。

页面实时预览是页面可视化搭建工具的必要部分，使用人员可以在通过页面预览来查看和验证可视化编辑的效果。

可选地，可以通过页面挂载方式预览目标页面，也可以通过后台渲染预览目标页面。

通过页面挂载方式预览目标页面，可以达到组件配置编辑时更快速的渲染，相较于后台渲染对于服务器的资源消耗更低。

后台渲染的方式是通过插入组件列表到页面中，编辑器的实现相对会比较轻量，并且编辑器不会和组件库框架产生耦合，便于以往其他框架的组件接入，扩展性更强。

通过本实施例提供的页面构方法，可以满足不同的业务场景进行业务组件和页面模板的自定义开发需求。本申请实施例提供的页面构建系统，可以支持现有的前端框架，以避免后续组件和模板自定义开发时的工作量和割裂感。可以是实现复用现有前端框架组件。

进一步地，组件树数据的构建过程以及后续的页面的配置参数的获取方式是通过可视化界面实现，可以方便用户操作。

本发明提供了一种页面构建方法，可以不需要复杂的编辑工作，通过可操作的显示界面实现组件的组合和构建，可以通过可视化的方式快速组装页面，及时响应各种场景下的页面需求，例如，各类活动和营销场景的需求，通过在线构建页面方法的运用，也可以降低参与方，减少人力资源的消耗，提升页面构建的效率，并减少开发人员的重复工作。

基于同一申请构思，本申请实施例中还提供了与页面构建方法对应的页面构建装置，由于本申请实施例中的装置解决问题的原理与前述的页面构建方法实施例相似，因此本实施例中的装置的实施可以参见上述方法的实施例中的描述，重复之处不再赘述。

请参阅图3，是本申请实施例提供的页面构建装置的功能模块示意图。本实施例中的页面构建装置中的各个模块用于执行上述方法实施例中的各个步骤。页面构建装置包括：第一确定模块310、第一生成模块320、接收模块330和第二生成模块340；其中各模块的内容如下所示：

第一确定模块310，用于根据页面构建需求，确定组件树数据；

第一生成模块320，用于根据该组件树数据，生成初始页面；

接收模块330，用于接收对该初始页面的配置参数；

第二生成模块340，用于根据该配置参数和该初始页面生成目标页面。

一种可能的实施方式中，第一确定模块310，包括：组件选取单元和树构建单元。

组件选取单元，用于根据页面构建需求，从组件库中选取多个目标组件；

树构建单元，用于根据多个该目标组件，构建组件树数据。

一种可能的实施方式中，树构建单元，用于基于多个该目标组件的配置需求以及多个该目标组件的组件标签，构建组件树的组件树声明，该配置需求包括多个该目标组件的层级关系，该组件树数据包括该组件树声明。

一种可能的实施方式中，页面构建装置还可以包括：替换模块，用于获取组件更换请求；根据该组件换请求，将当前页面中的第一组件替换为第二组件，该第一组件为当前页面中所包含的一个组件；根据该第二组件的组件标签，替换该组件树声明中的该第一组件的组件标签。

一种可能的实施方式中，第一生成模块320，用于根据该组件树声明，加载该目标组件，并对渲染出组件，以生成初始页面。

一种可能的实施方式中，第一生成模块320，用于根据该组件树声明，加载该目标组件，并对渲染出组件，以生成初始页面；对该组件树中父组件和子组件的数据流和事件进行关联。

一种可能的实施方式中，接收模块330，用于提供配置界面，该配置界面中包括一个或多个配置框，该配置框用于接收配置参数；获取该配置框中接收到的配置参数。

一种可能的实施方式中，第一确定模块310，用于根据页面构建需求，筛选出目标页面模板；根据该目标页面模板，确定出组件树数据。

此外，本申请实施例还提供一种计算机可读存储介质，该计算机可读存储介质上存储有计算机程序，该计算机程序被处理器运行时执行上述方法实施例中该的页面构建方法的步骤。

本申请实施例所提供的页面构建方法的计算机程序产品，包括存储了程序代码的计算机可读存储介质，该程序代码包括的指令可用于执行上述方法实施例中该的页面构建方法的步骤，具体可参见上述方法实施例，在此不再赘述。

在本申请所提供的几个实施例中，应该理解到，所揭露的装置和方法，也可以通过其它的方式实现。以上所描述的装置实施例仅仅是示意性的，例如，附图中的流程图和框图显示了根据本申请的多个实施例的装置、方法和计算机程序产品的可能实现的体系架构、功能和操作。在这点上，流程图或框图中的每个方框可以代表一个模块、程序段或代码的一部分，所述模块、程序段或代码的一部分包含一个或多个用于实现规定的逻辑功能的可执行指令。也应当注意，在有些作为替换的实现方式中，方框中所标注的功能也可以以不同于附图中所标注的顺序发生。例如，两个连续的方框实际上可以基本并行地执行，它们有时也可以按相反的顺序执行，这依所涉及的功能而定。也要注意的是，框图和/或流程图中的每个方框、以及框图和/或流程图中的方框的组合，可以用执行规定的功能或动作的专用的基于硬件的系统来实现，或者可以用专用硬件与计算机指令的组合来实现。

另外，在本申请各个实施例中的各功能模块可以集成在一起形成一个独立的部分，也可以是各个模块单独存在，也可以两个或两个以上模块集成形成一个独立的部分。

所述功能如果以软件功能模块的形式实现并作为独立的产品销售或使用时，可以存储在一个计算机可读取存储介质中。基于这样的理解，本申请的技术方案本质上或者说对现有技术做出贡献的部分或者该技术方案的部分可以以软件产品的形式体现出来，该计算机软件产品存储在一个存储介质中，包括若干指令用以使得一台计算机设备(可以是个人计算机，服务器，或者网络设备等)执行本申请各个实施例所述方法的全部或部分步骤。而前述的存储介质包括：U盘、移动硬盘、只读存储器(ROM，Read-Only Memory)、随机存取存储器(RAM，Random Access Memory)、磁碟或者光盘等各种可以存储程序代码的介质。需要说明的是，在本文中，诸如第一和第二等之类的关系术语仅仅用来将一个实体或者操作与另一个实体或操作区分开来，而不一定要求或者暗示这些实体或操作之间存在任何这种实际的关系或者顺序。而且，术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含，从而使得包括一系列要素的过程、方法、物品或者设备不仅包括那些要素，而且还包括没有明确列出的其他要素，或者是还包括为这种过程、方法、物品或者设备所固有的要素。在没有更多限制的情况下，由语句“包括……”限定的要素，并不排除在包括所述要素的过程、方法、物品或者设备中还存在另外的相同要素。

以上所述仅为本申请的优选实施例而已，并不用于限制本申请，对于本领域的技术人员来说，本申请可以有各种更改和变化。凡在本申请的精神和原则之内，所作的任何修改、等同替换、改进等，均应包含在本申请的保护范围之内。应注意到：相似的标号和字母在下面的附图中表示类似项，因此，一旦某一项在一个附图中被定义，则在随后的附图中不需要对其进行进一步定义和解释。

以上所述，仅为本申请的具体实施方式，但本申请的保护范围并不局限于此，任何熟悉本技术领域的技术人员在本申请揭露的技术范围内，可轻易想到变化或替换，都应涵盖在本申请的保护范围之内。因此，本申请的保护范围应以权利要求的保护范围为准。

Claims (11)

1.一种页面搭建方法，其特征在于，包括：

根据页面构建需求，确定组件树数据；

根据所述组件树数据，生成初始页面；

接收对所述初始页面的配置参数；以及

根据所述配置参数和所述初始页面生成目标页面。

2.根据权利要求1所述的方法，其特征在于，所述根据页面构建需求，确定组件树数据，包括：

根据页面构建需求，从组件库中选取多个目标组件；

根据多个所述目标组件，构建组件树数据。

3.根据权利要求2所述的方法，其特征在于，所述根据多个所述目标组件，构建组件树数据，包括：

基于多个所述目标组件的配置需求以及多个所述目标组件的组件标签，构建组件树的组件树声明，所述配置需求包括多个所述目标组件的层级关系，所述组件树数据包括所述组件树声明。

4.根据权利要求3所述的方法，其特征在于，所述方法还包括：

获取组件更换请求；

根据所述组件换请求，将当前页面中的第一组件替换为第二组件，所述第一组件为当前页面中所包含的一个组件；

根据所述第二组件的组件标签，替换所述组件树声明中的所述第一组件的组件标签。

5.根据权利要求3或4所述的方法，其特征在于，所述根据所述组件树数据，生成初始页面，包括：

根据所述组件树声明，加载所述目标组件，并对渲染出组件，以生成初始页面。

6.根据权利要求3或4所述的方法，其特征在于，所述根据所述组件树数据，生成初始页面，包括：

根据所述组件树声明，加载所述目标组件，并对渲染出组件，以生成初始页面；

对所述组件树中父组件和子组件的数据流和事件进行关联。

7.根据权利要求1所述的方法，其特征在于，所述接收对所述初始页面的配置参数，包括：

提供配置界面，所述配置界面中包括一个或多个配置框，所述配置框用于接收配置参数；

获取所述配置框中接收到的配置参数。

8.根据权利要求1所述的方法，其特征在于，所述根据页面构建需求，确定组件树数据，包括：

根据页面构建需求，筛选出目标页面模板；

根据所述目标页面模板，确定出组件树数据。

9.一种页面搭建装置，其特征在于，包括：

第一确定模块，用于根据页面构建需求，确定组件树数据；

第一生成模块，用于根据所述组件树数据，生成初始页面；

接收模块，用于接收对所述初始页面的配置参数；以及

第二生成模块，用于根据所述配置参数和所述初始页面生成目标页面。

10.一种电子设备，其特征在于，包括：处理器、存储器；所述存储器存储有所述处理器可执行的机器可读指令，当电子设备运行时，所述机器可读指令被所述处理器执行时执行如权利要求1-8任意一项所述的方法的步骤。

11.一种计算机可读存储介质，其特征在于，该计算机可读存储介质上存储有计算机程序，该计算机程序被处理器运行时执行如权利要求1-8任意一项所述的方法的步骤。

Images