CN112269576A - 一种组件展示方法、装置、服务器和存储介质 - Google Patents

Abstract

本发明实施例公开了一种组件展示方法、装置、设备和存储介质。该方法包括：接收到用户界面UI插件客户端发送的组件展示请求时，获取预先配置的预设格式化文件；其中，预设格式化文件中包含组件库中至少一个组件的属性信息；从预设格式化文件中读取各组件的属性信息，根据各组件的属性信息生成超文本标记语言HTML文件；将HTML文件发送至UI插件客户端，以使UI插件客户端根据HTML文件渲染并显示包含各组件的组件展示页面。本发明实施例的技术方案，解决了WEB组件不能直接供UI用户使用，且WEB组件库与UI插件在同步开发时效率低的问题，实现了提高WEB组件与UI插件的同步转化效率，降低人力成本的效果。

Description

一种组件展示方法、装置、服务器和存储介质

技术领域

本发明实施例涉及计算机技术，尤其涉及一种组件展示方法、装置、服务器和存储介质。

背景技术

随着互联网技术的发展，用户界面(User Interface，UI)视觉风格越来越受到重视，业界已出现多种UI视觉的WEB组件库。UI设计人员可以使用UI插件绘制用户界面图，具体的，UI插件将WEB组件库中的多种组件进行同步展示，UI设计人员可以通过将UI插件展示的组件拖动到用户界面图上，来实现用户界面图的绘制。

在实现本发明的过程中，发明人发现现有技术中至少存在如下问题：

WEB组件库中的组件由组件开发人员进行开发，UI插件由插件开发人员进行开发，也即WEB组件库与UI插件分别开发、分别更新。而为了实现WEB组件库中的组件在UI插件端的同步展示，开发时需要保持两方同步，效率较低，并且人力成本也较高。

发明内容

本发明实施例提供了一种组件展示方法、装置、设备和存储介质，以实现提高WEB组件与UI插件的同步效率，降低人力成本的效果。

第一方面，本发明实施例提供了一种组件展示方法，该方法包括：

接收到用户界面UI插件客户端发送的组件展示请求时，获取预先配置的预设格式化文件；其中，所述预设格式化文件中包含组件库中至少一个组件的属性信息；

从所述预设格式化文件中读取各所述组件的属性信息，根据各所述组件的属性信息生成超文本标记语言HTML文件；

将所述HTML文件发送至所述UI插件客户端，以使所述UI插件客户端根据所述HTML文件渲染并显示包含各所述组件的组件展示页面。

第二方面，本发明实施例还提供了一种组件展示装置，该装置包括：

预设格式化文件获取模块，用于接收到用户界面UI插件客户端发送的组件展示请求时，获取预先配置的预设格式化文件；其中，所述预设格式化文件中包含组件库中至少一个组件的属性信息；

超文本标记语言文件生成模块，用于从所述预设格式化文件中读取各所述组件的属性信息，根据各所述组件的属性信息生成超文本标记语言HTML文件；

超文本标记语言文件发送模块，用于将所述HTML文件发送至所述UI插件客户端，以使所述UI插件客户端根据所述HTML文件渲染并显示包含各所述组件的组件展示页面。

第三方面，本发明实施例还提供了一种服务器，其中，所述服务器包括：

一个或多个处理器；

存储装置，用于存储一个或多个程序；

当所述一个或多个程序被所述一个或多个处理器执行，使得所述一个或多个处理器实现如本发明任意实施例所提供的组件展示方法。

第四方面，本发明实施例还提供了一种计算机可读存储介质，其上存储有计算机程序，其中，该程序被处理器执行时实现如本发明任意实施例所提供的组件展示方法。

本发明实施例通过接收到用户界面UI插件客户端发送的组件展示请求时，获取预先配置的预设格式化文件；其中，所述预设格式化文件中包含组件库中至少一个组件的属性信息；从所述预设格式化文件中读取各所述组件的属性信息，根据各所述组件的属性信息生成超文本标记语言HTML文件；将所述HTML文件发送至所述UI插件客户端，以使所述UI插件客户端根据所述HTML文件渲染并显示包含各所述组件的组件展示页面。通过预先配置的预设格式化文件，使组件库中的组件在UI插件客户端进行同步展示，解决了WEB组件不能直接供UI用户使用，且WEB组件库与UI插件在同步开发时效率较低的问题，实现了提高WEB组件与UI插件的同步转化效率，降低人力成本的效果。

附图说明

为了更清楚地说明本发明实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图做一简单地介绍，显而易见地，下面描述中的附图是本发明的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。

图1是本发明实施例一提供的一种组件展示方法的流程图；

图2是本发明实施例一所涉及的WEB组件库中不同样式的Button组件的示意图；

图3是本发明实施例一所涉及的Button组件展示页面示意图；

图4是本发明实施例一所涉及的Button组件的编辑面板示意图；

图5是本发明实施例二提供的一种组件展示方法的流程图；

图6是本发明实施例二所涉及的WEB组件属性示例图；

图7是本发明实施例三提供的一种组件展示装置的结构图；

图8是本发明实施例四中的一种服务器的结构示意图。

具体实施方式

下面结合附图和实施例对本发明作进一步的详细说明。可以理解的是，此处所描述的具体实施例仅仅用于解释本发明，而非对本发明的限定。另外还需要说明的是，为了便于描述，附图中仅示出了与本发明相关的部分而非全部结构。

实施例一

图1为本发明实施例一提供的一种组件展示方法的流程图，本实施例可适用于用户界面图上展示组件的情况。该方法可以由组件展示装置来执行。该方法具体包括以下步骤：

S110、接收到用户界面(UI)插件客户端发送的组件展示请求时，获取预先配置的预设格式化文件；其中，预设格式化文件中包含组件库中至少一个组件的属性信息。

UI插件客户端可提供组件展示页面，用户可通过组件展示页面对组件进行选择和属性设置。。当用户在计算机上安装了UI插件客户端并启动使用UI插件客户端时，UI插件客户端需要向服务器端发送组件展示请求。服务器端接收到UI插件客户端发送的组件展示请求时，获取预先配置的预设格式化文件，预设格式化文件中包含服务器预先从WEB组件库中提取的需要转化的组件对应的全部或部分属性信息，需要转化的组件为至少一个，属性信息为UI插件所需的属性，示例性的，属性信息包括：组件的类型、大小、形状等。可选的，预设格式化文件为JavaScript对象表示法(JSON)文件。JSON文件是一种轻量级的基于JavaScript语法子集的开放标准数据数据交换格式，采用完全独立于编程语言的文本格式来存储和表示数据。JSON文件还是一种轻量级的数据交换格式，具有简洁和清晰的层次结构，便于阅读和编写，同时也易于解析和生成，并有效地提升网络传输效率。

以WEB组件库中的按钮(Button)组件为例，如图2所示为WEB组件库中的不同样式的Button组件，从不同样式的Button组件中选择需要转化的组件，示例性的，选取需要转化的组件为普通样式的主(primary)按钮和信息(info)按钮，将需要转化的primary按钮组件和info按钮组件的全部或部分属性信息配置成JSON文件。其中Button组件属性信息包括：按钮类型、按钮尺寸以及按钮形状。

S120、从预设格式化文件中读取各所述组件的属性信息，根据各组件的属性信息生成超文本标记语言(HTML)文件。

服务器端从获取的预设格式化文件中读取需要转化的各组件的属性信息，根据各组件的属性信息，生成HTML文件。具体的：根据预设DOM模板将各组件的属性信息转化为HTML标签元素，根据转化后的各HTML标签元素生成HTML文件；其中，DOM模板中配置有组件库中各种类型的组件对应的HTML标签元素转化方法。

在上述根据预设DOM模板将各组件的属性信息转化为HTML标签元素时，具体是针对各组件，通过执行DOM模板中配置的该组件的组件类型对应的HTML标签元素转化方法的代码，确定该组件对应的HTML标签；然后将读取的该组件的属性信息与该HTML标签进行绑定，得到该组件对应的HTML标签元素。可以预先将组件在组件库中的名称写入预设格式化文件，组件在组件库中的名称和HTML标签符号构成组件的HTML标签。以某一button组件为例说明，在预设格式化文件中该button组件的属性信息包括：id：button-demo1、type：primary、size：large、以及innerText：主要按钮；该button组件的组件名称为j-button，通过执行DOM模板中配置的button组件类型对应的HTML标签转化方法的代码，确定该button组件对应的HTML标签包括：<j-button和</j-button>；将该button组件的属性信息与该HTML标签进行绑定后，得到对应的HTML标签元素，如下所示：

<j-button

id＝“button-demo1”；

type＝“primary”

size＝“large”

innerText＝“主要按钮”

</j-button>

在上述根据转化后的各HTML标签生成HTML文件时，具体可以直接将转化后的各HTML标签写入到空白的HTML文件中。较佳的，在将转化后的各HTML标签写入到空白的HTML文件中之前，还需要将转化后的各HTML标签中不符合HTML规则的属性信息，进一步转化为符合HTML规则的属性信息，这里具体可以通过调用组件库提供的转化服务实现属性信息的转化。仍以button组件为例说明，需要转化的属性如type、size等，转化为符合HTML规则的标签名称、样式等，不需转化的属性如id、innertext等保留下来，最终得到发送给客户端的可用于渲染显示的HTML文件。

S130、将HTML文件发送至UI插件客户端，以使UI插件客户端根据HTML文件渲染并显示包含各组件的组件展示页面。

服务器将HTML文件发送至UI插件客户端，UI插件客户端根据接收的HTML文件进行渲染，对包含HTML中各组件的组件展示页面进行显示，实现了配置化的WEB组件库中的组件向UI插件的转换，使WEB组件库中的组件与UI插件保持同步，避免了WEB组件和UI插件的重复开发，提高了UI插件开发效率。

可选的，预设格式化文件中还包含组件的属性信息的编辑方式和可选项字段；相应的，生成的所述HTML文件中包含所述编辑方式和所述可选项字段；在预设格式化文件中还存储了属性信息的编辑方式和可选项字段，用于在UI插件的编辑面板中显示，用户可通过编辑面板中显示的编辑方式和可选项对组件进行编辑，生成设计视图。

在上述实施例的基础上，在所述UI插件客户端根据所述HTML文件渲染并显示包含各所述组件的组件展示页面之后，所述方法还包括：在检测到对所述组件展示页面中显示的组件的属性编辑触发操作时，根据所述组件的属性信息的编辑方式和可选项字段，渲染并显示属性编辑页面，以供用户在所述属性编辑页面中对所述组件的属性进行编辑。由于预设格式化文件中存有各个属性的编辑方式和可选项字段，所以可以渲染出属性编辑页面。示例性的，以Button组件为例，当检测到对Button按钮的属性编辑触发操作时，以Button组件的尺寸属性为例，编辑方式字段为select，表明尺寸属性在编辑面板中已下拉框形式出现，可选项字段options中配置有大、中、小三个选项，当在下拉框中选择任一个选项后，相应的组件DOM中的尺寸的属性值会被置为选中的值。如图3所示，为Button组件的展示页面，可以通过点击操作对按钮进行选择，对选择的按钮进行编辑如图4所示，为Button组件的编辑面板，对选择的需要编辑的按钮进行如大小等可选值属性的编辑，实现对按钮的样式、尺寸等的不同规格的调整。

本实施例的技术方案，通过接收到UI插件客户端发送的组件展示请求时，获取预先配置的预设格式化文件；其中，所述预设格式化文件中包含组件库中至少一个组件的属性信息；从所述预设格式化文件中读取各所述组件的属性信息，根据各所述组件的属性信息生成超文本标记语言HTML文件；将所述HTML文件发送至所述UI插件客户端，以使所述UI插件客户端根据所述HTML文件渲染并显示包含各所述组件的组件展示页面。通过预先配置的预设格式化文件，使组件库中的组件在UI插件客户端进行同步展示，解决了WEB组件不能直接供UI用户使用，且WEB组件库与UI插件在同步开发时效率较低的问题，实现了提高WEB组件与UI插件的同步转化效率，降低人力成本的效果。

实施例二

图5为本发明实施例二提供的组件展示方法的流程图，本实施例在上述各实施例的基础上的进一步优化，在接收到UI插件客户端发送的组件展示请求之前，组件展示方法还包括：从组件库文件中读取各组件的属性信息；将各组件的属性信息中至少一个组件的至少一个属性信息，配置在预设格式化文件中。通过预设格式化文件实现WEB组件的属性向UI插件的转换，使转换后的UI插件的属性更加符合实际需要。其中与上述各实施例相同或相应的术语的解释在此不再赘述。

参见图5，本实施例提供的组件展示方法包括：

S210、从组件库文件中读取各组件的属性信息。

服务器将WEB组件库中的需要转化的组件的所有属性或部分属性从WEB组件库的某类文件中提取出来，示例性的，WEB组件库的某类文件可以是readme文件，通过脚本程序读出readme文件中的所有的组件属性信息，如图3所示为读取的按钮Button组件的属性信息。

S220、将各组件的属性信息中至少一个组件的至少一个属性信息，配置在预设格式化文件中。

将需要转化的组件的属性信息配置在预设格式化文件中，配置在预设格式化文件中的属性信息可以是需要转化组件的全部属性信息，也可以是需要转化组件的部分属性信息，根据UI插件的需要决定。示例性的，如图6所示，框选的是UI插件所需属性信息，将框选的属性信息配置在预设格式化文件中。比如，以Button组件为例，UI插件所需属性信息包括：原生类型、类型、尺寸、是否加载中状态和形状。将上述Button组件的属性信息配置在预设格式化文件。

可选的，将各组件的属性信息中至少一个组件的至少一个属性信息，配置在预设格式化文件中，包括：将各组件的属性信息中至少一个组件的至少一个属性信息，分别写入预设格式化文件的数组中；其中，数组包括至少一个数组元素，每个数组元素对应组件库中的一个组件，用于保存对应组件的属性信息，并且数组元素与组件的对应关系是根据各组件在组件展示页面中的位置顺序确定。按照在组件展示页面中的位置顺序将组件的属性信息依次写入到数组中，每个组件对应一个数组元素。

示例性的，在组件展示页面中需要展示的组件的位置顺序为信息按钮、主按钮和次按钮，根据位置顺序建立数组中数组元素与组件的对应关系，即该数组的第一个数组元素对应信息按钮，用于存储信息按钮的属性信息，第二个数组元素对应主按钮，用于存储主按钮的属性信息，第三个数组元素对应次按钮，用于存储次按钮的属性信息。将组件的属性信息按照在数组中的存储顺序进行展示，避免了组件展示页面中组件信息显示混乱，增大用户的使用难度。

S230、接收到用户界面UI插件客户端发送的组件展示请求时，获取预先配置的预设格式化文件；其中，预设格式化文件中包含组件库中至少一个组件的属性信息。

S240、从预设格式化文件中读取各所述组件的属性信息，根据各组件的属性信息生成超文本标记语言HTML文件。

S250、将HTML文件发送至UI插件客户端，以使UI插件客户端根据HTML文件渲染并显示包含各组件的组件展示页面。

在上述实施例的基础上，组件展示方法还包括：在接收到格式化文件更新请求时，根据格式化文件更新请求对当前保存的预设格式化文件执行更新操作；其中，更新操作包括组件属性信息的添加操作、组件属性信息的删除操作、以及组件属性信息的修改操作中的至少一个。当WEB组件由于实际需要进行了组件的增加或删除操作时，用户在使用UI插件时需要保持与WEB组件的同步，故服务器会接收到UI插件客户端发送的预设格式化文件更新请求，对保存在预设格式化文件中的至少一个组件属性信息进行添加或删除操作，实现WEB组件向UI插件的同步转化。使WEB组件通过更新的预设格式化文件转化的UI插件更加符合用户需要。

本实施例的技术方案，通过从组件库文件中读取各组件的属性信息；将各组件的属性信息中至少一个组件的至少一个属性信息，配置在预设格式化文件中。通过预设格式化文件实现WEB组件的属性向UI插件的转换，使转换后的UI插件的属性更加符合实际需要。接收到UI插件客户端发送的组件展示请求时，获取预先配置的预设格式化文件；其中，所述预设格式化文件中包含组件库中至少一个组件的属性信息；从所述预设格式化文件中读取各所述组件的属性信息，根据各所述组件的属性信息生成超文本标记语言HTML文件；将所述HTML文件发送至所述UI插件客户端，以使所述UI插件客户端根据所述HTML文件渲染并显示包含各所述组件的组件展示页面。通过预先配置的预设格式化文件，使组件库中的组件在UI插件客户端进行同步展示，解决了WEB组件不能直接供UI用户使用，且WEB组件库与UI插件在同步开发时效率较低的问题，实现了提高WEB组件与UI插件的同步转化效率，降低人力成本的效果。

以下是本发明实施例提供的组件展示装置的实施例，该装置与上述各实施例的组件展示方法属于同一个发明构思，在组件展示装置的实施例中未详尽描述的细节内容，可以参考上述组件展示方法的实施例。

实施例三

图7为本发明实施例三提供的组件展示装置的结构示意图，本实施例可适用于组件在展示页面进行展示的情况，该组件展示装置的具体包括：预设格式化文件获取模块310、超文本标记语言文件生成模块320和超文本标记语言文件发送模块330。

其中，预设格式化文件获取模块310，用于接收到用户界面UI插件客户端发送的组件展示请求时，获取预先配置的预设格式化文件；其中，所述预设格式化文件中包含组件库中至少一个组件的属性信息；超文本标记语言文件生成模块320，用于从所述预设格式化文件中读取各所述组件的属性信息，根据各所述组件的属性信息生成超文本标记语言HTML文件；超文本标记语言文件发送模块330，用于将所述HTML文件发送至所述UI插件客户端，以使所述UI插件客户端根据所述HTML文件渲染并显示包含各所述组件的组件展示页面。

在上述实施例的技术方案中，组件展示装置，还包括：

属性信息读取模块，用于从组件库文件中读取各组件的属性信息；

属性信息配置模块，用于将各所述组件的属性信息中至少一个组件的至少一个属性信息，配置在预设格式化文件中。

在上述实施例的技术方案中，属性信息配置模块，包括：

属性信息写入单元，用于将各所述组件的属性信息中至少一个组件的至少一个属性信息，分别写入预设格式化文件的数组中；

其中，所述数组包括至少一个数组元素，每个数组元素对应所述组件库中的一个组件，用于保存对应组件的属性信息，并且数组元素与组件的对应关系是根据各组件在所述组件展示页面中的位置顺序确定。

在上述实施例的技术方案中，超文本标记语言文件生成模块320，包括：

属性信息挂载单元，用于根据预设文件对象模型DOM模板将各组件的属性信息转化为HTML标签元素；

HTML文件生成单元，用于根据转化后的各HTML标签元素生成HTML文件；其中，所述DOM模板中配置有组件库中各种类型的组件对应的HTML标签元素转化方法。

在上述实施例的技术方案中，组件展示装置，还包括：

预设格式化文件更新模块，用于在接收到格式化文件更新请求时，根据所述格式化文件更新请求对当前保存的所述预设格式化文件执行更新操作；其中，所述更新操作包括组件属性信息的添加操作、组件属性信息的删除操作、以及组件属性信息的修改操作中的至少一个。

可选的，预设格式化文件中还包含所述组件的属性信息的编辑方式和可选项字段；相应的，生成的所述HTML文件中包含所述编辑方式和所述可选项字段；

在上述实施例的技术方案中，组件展示装置，还包括：

属性编辑页面渲染模块，用于在检测到对所述组件展示页面中显示的组件的属性编辑触发操作时，根据所述组件的属性信息的编辑方式和可选项字段，渲染并显示属性编辑页面，以供用户在所述属性编辑页面中对所述组件的属性进行编辑。

可选的，预设格式化文件为JavaScript对象表示法JSON文件。

本发明实施例所提供的组件展示装置可执行本发明任意实施例所提供的组件展示方法，具备执行方法相应的功能模块和有益效果。

值得注意的是，上述组件展示装置的实施例中，所包括的各个单元和模块只是按照功能逻辑进行划分的，但并不局限于上述的划分，只要能够实现相应的功能即可；另外，各功能单元的具体名称也只是为了便于相互区分，并不用于限制本发明的保护范围。

实施例四

图8为本发明实施例四提供的一种服务器的结构示意图，如图8所示，该服务器包括处理器410、存储器420、输入装置430和输出装置440；服务器中处理器410的数量可以是一个或多个，图8中以一个处理器410为例；服务器中的处理器410、存储器420、输入装置430和输出装置440可以通过总线或其他方式连接，图8中以通过总线连接为例。

存储器420作为一种计算机可读存储介质，可用于存储软件程序、计算机可执行程序以及模块，如本发明实施例中的主题更新方法对应的程序指令/模块(例如，组件展示装置中的预设格式化文件获取模块310、超文本标记语言文件生成模块320和超文本标记语言文件发送模块330。处理器410通过运行存储在存储器420中的软件程序、指令以及模块，从而执行服务器的各种功能应用以及数据处理，即实现上述的主题更新方法。

存储器420可主要包括存储程序区和存储数据区，其中，存储程序区可存储操作***、至少一个功能所需的应用程序；存储数据区可存储根据终端的使用所创建的数据等。此外，存储器420可以包括高速随机存取存储器，还可以包括非易失性存储器，例如至少一个磁盘存储器件、闪存器件、或其他非易失性固态存储器件。在一些实例中，存储器420可进一步包括相对于处理器410远程设置的存储器，这些远程存储器可以通过网络连接至服务器。上述网络的实例包括但不限于互联网、企业内部网、局域网、移动通信网及其组合。

输入装置430可用于接收输入的数字或字符信息，以及产生与服务器的用户设置以及功能控制有关的键信号输入。输出装置440可包括显示屏等显示设备。

实施例五

本实施例提供一种计算机可读存储介质，其上存储有计算机程序，该程序被处理器执行时实现如本发明任意实施例所述的组件展示方法。该方法包括：

接收到用户界面UI插件客户端发送的组件展示请求时，获取预先配置的预设格式化文件；其中，所述预设格式化文件中包含组件库中至少一个组件的属性信息；

从所述预设格式化文件中读取各所述组件的属性信息，根据各所述组件的属性信息生成超文本标记语言HTML文件；

将所述HTML文件发送至所述UI插件客户端，以使所述UI插件客户端根据所述HTML文件渲染并显示包含各所述组件的组件展示页面。

当然,本发明实施例所提供的一种包含计算机可执行指令的存储介质,其计算机可执行指令不限于如上所述的方法操作,还可以执行本发明任意实施例所提供的组件展示中的相关操作。

通过以上关于实施方式的描述，所属领域的技术人员可以清楚地了解到，本发明可借助软件及必需的通用硬件来实现，当然也可以通过硬件实现，但很多情况下前者是更佳的实施方式。基于这样的理解，本发明的技术方案本质上或者说对现有技术做出贡献的部分可以以软件产品的形式体现出来，该计算机软件产品可以存储在计算机可读存储介质中，如计算机的软盘、只读存储器(Read-Only Memory，ROM)、随机存取存储器(RandomAccess Memory，RAM)、闪存(FLASH)、硬盘或光盘等，包括若干指令用以使得一台计算机设备(可以是个人计算机，服务器，或者网络设备等)执行本发明各个实施例所述的组件展示方法。

值得注意的是，上述组件展示装置的实施例中，所包括的各个单元和模块只是按照功能逻辑进行划分的，但并不局限于上述的划分，只要能够实现相应的功能即可；另外，各功能单元的具体名称也只是为了便于相互区分，并不用于限制本发明的保护范围。

注意，上述仅为本发明的较佳实施例及所运用技术原理。本领域技术人员会理解，本发明不限于这里所述的特定实施例，对本领域技术人员来说能够进行各种明显的变化、重新调整和替代而不会脱离本发明的保护范围。因此，虽然通过以上实施例对本发明进行了较为详细的说明，但是本发明不仅仅限于以上实施例，在不脱离本发明构思的情况下，还可以包括更多其他等效实施例，而本发明的范围由所附的权利要求范围决定。

Claims (10)

1.一种组件展示方法，其特征在于，包括：

接收到用户界面UI插件客户端发送的组件展示请求时，获取预先配置的预设格式化文件；其中，所述预设格式化文件中包含组件库中至少一个组件的属性信息；

从所述预设格式化文件中读取各所述组件的属性信息，根据各所述组件的属性信息生成超文本标记语言HTML文件；

将所述HTML文件发送至所述UI插件客户端，以使所述UI插件客户端根据所述HTML文件渲染并显示包含各所述组件的组件展示页面。

2.根据权利要求1所述的方法，其特征在于，在接收到UI插件客户端发送的组件展示请求之前，所述方法还包括：

从组件库文件中读取各组件的属性信息；

将各所述组件的属性信息中至少一个组件的至少一个属性信息，配置在预设格式化文件中。

3.根据权利要求2所述的方法，其特征在于，将各所述组件的属性信息中至少一个组件的至少一个属性信息，配置在预设格式化文件中，包括：

将各所述组件的属性信息中至少一个组件的至少一个属性信息，分别写入预设格式化文件的数组中；

其中，所述数组包括至少一个数组元素，每个数组元素对应所述组件库中的一个组件，用于保存对应组件的属性信息，并且数组元素与组件的对应关系是根据各组件在所述组件展示页面中的位置顺序确定。

4.根据权利要求1所述的方法，其特征在于，根据各所述组件的属性信息生成HTML文件，包括：

根据预设文件对象模型DOM模板将各组件的属性信息转化为HTML标签元素；

根据转化后的各所述HTML标签元素生成HTML文件；

其中，所述DOM模板中配置有组件库中各种类型的组件对应的HTML标签元素转化方法。

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

在接收到格式化文件更新请求时，根据所述格式化文件更新请求对当前保存的所述预设格式化文件执行更新操作；

其中，所述更新操作包括组件属性信息的添加操作、组件属性信息的删除操作、以及组件属性信息的修改操作中的至少一个。

6.根据权利要求1所述的方法，其特征在于，所述预设格式化文件中还包含所述组件的属性信息的编辑方式和可选项字段；相应的，生成的所述HTML文件中包含所述编辑方式和所述可选项字段；

在所述UI插件客户端根据所述HTML文件渲染并显示包含各所述组件的组件展示页面之后，所述方法还包括：

在检测到对所述组件展示页面中显示的组件的属性编辑触发操作时，根据所述组件的属性信息的编辑方式和可选项字段，渲染并显示属性编辑页面，以供用户在所述属性编辑页面中对所述组件的属性进行编辑。

7.根据权利要求1-6中任一项所述的方法，其特征在于，所述预设格式化文件为JavaScript对象表示法JSON文件。

8.一种组件展示装置，其特征在于，包括：

预设格式化文件获取模块，用于接收到用户界面UI插件客户端发送的组件展示请求时，获取预先配置的预设格式化文件；其中，所述预设格式化文件中包含组件库中至少一个组件的属性信息；

超文本标记语言文件生成模块，用于从所述预设格式化文件中读取各所述组件的属性信息，根据各所述组件的属性信息生成超文本标记语言HTML文件；

超文本标记语言文件发送模块，用于将所述HTML文件发送至所述UI插件客户端，以使所述UI插件客户端根据所述HTML文件渲染并显示包含各所述组件的组件展示页面。

9.一种服务器，其特征在于，所述服务器包括：

一个或多个处理器；

存储器，用于存储一个或多个程序；

当所述一个或多个程序被所述一个或多个处理器执行，使得所述一个或多个处理器实现如权利要求1-7中任一所述的组件展示方法。

10.一种计算机可读存储介质，其上存储有计算机程序，其特征在于，该程序被处理器执行时实现如权利要求1-7中任一所述的组件展示方法。

Images