CN115268861B - 自定义组件的引入方法、系统、设备和存储介质 - Google Patents

Abstract

本发明提供了一种自定义组件的引入方法、系统、设备和存储介质。其中自定义组件的引入方法具体包括：配置标准组件接口，进而根据标准组件接口的配置约定实现与自定义组件的适配，其中，自定义组件包括了可以被解析成最终页面渲染效果的组件描述信息，将解析结果与标准组件接口适配生成封装对象，将封装对象导入低代码开发工具中实现自定义组件基于标准组件接口的页面渲染效果。通过本发明的技术方案，实现低代码工具与UI组件库是完全解耦的，实现了将任意UI组件导入通过标准组件接口到低代码开发工具，能够充分利用UI组件中的重复代码，具备更多的组件选择，使得低代码开发环境下的自定义组件引入的机制更加灵活。

Description

自定义组件的引入方法、系统、设备和存储介质

技术领域

本申请涉及计算机技术领域，尤其涉及一种自定义组件的引入方法、系统、设备和存储介质。

背景技术

Web技术的用户界面(User Interface，UI)开发过程中存在着大量重复、繁琐的劳动，低代码UI开发工具应运而生，低代码引擎是具备强大扩展能力的低代码研发框架，使用者只需要基于低代码引擎便可以快速定制符合自己业务需求的低代码平台，同时低代码引擎还在标准低代码设计器的基础上提供了简单易用的定制扩展能力，能够满足业务独特的功能需要，低代码工具不需要开发者有编程基础，只需要基现有预设组件进行图形界面交互就能开发出Web UI。

于现有技术中，低代码开发技术大多数以SasS(Software as a Service)形式提供，低代码工具预置了一套UI组件，通过使用默认提供的组件开发者通过组合这些组件，再补充业务逻辑，就可以完成Web UI开发；低代码工具一般可以分为运行时、编辑器、组件库这三个部分，运行时负责渲染低代码应用，编辑器提供低代码开发的图形界面，组件库则是开发者可以使用的UI组件库；在从传统UI开发方式转变到低代码开发的过程中绝大部分的低代码工具并不支持导入外部组件，即开发者只能选择低代码工具内置的UI组件库进行开发，无法实现UI组件的重复利用，预先的UI组件库中UI组件的类型和样式上选择十分有限。

因此，于低代码开发工具中亟需一套更灵活自定义UI引入的机制，以便能够在低代码工具中集成自定义的UI，来更好地满足需求。

发明内容

针对现有技术中的缺陷，本申请提出来一种自定义组件的引入方法、系统、设备和存储介质。

本申请的第一方面提供了一种自定义组件的引入方法，该种引入方法包括；

配置标准组件接口，标准组件接口至少包括配置约定；

创建自定义组件，自定义组件至少包括组件描述信息；

对组件描述信息进行解析，生成解析结果；

将解析结果按照配置约定适配于标准组件接口，生成自定义组件的封装对象；

将自定义组件对应的封装对象引入至低代码开发工具中，实现页面渲染。

在上述第一方面的一种可能的实现中，配置标准组件接口包括：

获取自定义组件的要素集；

根据要素集的配置信息，实现标准组件接口的初始化配置。

在上述第一方面的一种可能的实现中，解析组件描述信息包括：

获取描述组件信息中的参数信息；

获取自定义组件对应的全局状态树；

根据全局状态树将参数信息转换为适配于标准组件接口的配置信息。

在上述第一方面的一种可能的实现中，解析组件描述信息包括：

获取组件描述信息中的状态标识；

在存在自定义组件的第一状态更新为第二状态的情况下，将第二状态添加或者更新至自定义组件对应的全局状态树中；

根据状态标识更新依赖于第一状态的自定义组件。

在上述第一方面的一种可能的实现中，解析组件描述信息包括：

获取组件描述信息中的监听事件；

根据触发的监听事件，调用自定义组件对应的全局方法库中的执行方法，实现监听事件和执行方法的映射。

在上述第一方面的一种可能的实现中，获取组件描述信息的方法标识；

根据方法标识将组件描述信息中的执行方法更新至自定义组件的全局方法库中。

在上述第一方面的一种可能的实现中，实现页面渲染包括：

根据封装对象的组件标识，获取封装对象对应的自定义组件的组件树；

获取封装对象中的组件插槽；

根据组件树和组件插槽，依次实现页面渲染。

本申请的第二方面提供了一种自定义组件的引入系统，该引入系统具体包括：

配置单元，用于配置标准组件接口，标准组件接口至少包括配置约定；

创建单元，用于创建自定义组件，自定义组件至少包括组件描述信息；

解析单元，用于对组件描述信息进行解析，生成解析结果；

适配单元，用于将解析结果按照配置约定适配于标准组件接口，生成自定义组件的封装对象；

渲染单元，用于将自定义组件对应的封装对象引入至低代码开发工具中，实现页面渲染。

本申请的第三方面提供了一种电子设备，包括：存储器，存储器用于存储处理程序；处理器，处理器执行处理程序时实现前述第一方面所提供的自定义组件的引入方法。

本申请的第四方面提供了一种可读存储介质，该种可读存储介质上存储有处理程序，处理程序被处理器执行时实现前述第一方面所提供的自定义组件的引入方法。

与现有技术相比，本发明具有如下的有益效果：

通过本申请提供的自定义组件的引入方法，能够通过预先配置标准组件接口，将创建的自定义UI组件引入至低代码开发工具中，低代码工具的运行时和编辑器在设计上，也实现了读取和运行这套接口的能力，运行时和编辑器可以兼容组件的任何具体实现，低代码工具与UI组件库是完全解耦的，实现了将任意UI组件导入到低代码开发工具中，使UI开发者能够充分利用UI组件中的重复代码，并且有了更多的组件选择，同时使得低代码开发环境下的自定义UI引入的机制更加灵活，进而实现了各个UI组件的功能更明确、逻辑更清晰。

附图说明

通过阅读参照以下附图对非限制性实施例所作的详细描述，本发明的其它特征、目的和优点将会变得更明显：

图1根据本申请实施例，示出了一种自定义组件的引入方法的流程示意图；

图2根据本申请实施例，示出了一种自定义组件的引入系统框图；

具体实施方式

下面结合具体实施例对本发明进行详细说明。以下实施例将有助于本领域的技术人员进一步理解本发明，但不以任何形式限制本发明。应当指出的是，对本领域的普通技术人员来说，在不脱离本发明构思的前提下，还可以做出若干变化和改进。这些都属于本发明的保护范围。

为了解决现有技术中，在从传统UI开发方式转变到低代码开发的过程中绝大部分的低代码工具并不支持导入外部组件，即开发者只能选择低代码工具内置的UI组件库进行开发，无法实现UI组件的重复利用，预先的UI组件库中UI组件的类型和样式上选择十分有限的技术问题，本申请提供的自定义组件的引入方法能够使得能够通过预先配置标准组件接口，将创建的自定义UI组件引入至低代码开发工具中，实现低代码工具与UI组件库是完全解耦的，将任意UI组件导入到低代码开发工具中。

具体地，图1根据本申请的一些实施例，示出了一种自定义组件的引入方法的流程示意图，具体包括：

步骤100：配置标准组件接口，标准组件接口至少包括配置约定。可以理解的是，UI组件设计的本质就是骨架设计与界面的具体实现，其中骨架设计包括了基础结构加上行为模式，UI组件的实现包括了页面呈现的效果，骨架设计相对于标准接口的配置，UI组件库中，骨架设计是相对不变的部分；而UI设计是丰富的，是多变的，支持用户根据页面渲染实际效果的需求进行自定义组件的设计和实现，对于自定义的组件具体可以包括组件描述信息，配置约定可以通过对UI组件的配置进行整合，将配置约定中具有相同基础结构和行为模式的多种UI组件进行整合，以便保证多种相同结构寄出的UI组件可以基于标准组件接口实现重复利用。

于本申请的一些实施例中，标准组件接口的配置其实质就是UI组件设计的骨架部分，该部分的包括了UI组件的要素，例如参数、状态、行为、插槽等部分的数据结构，配置为一个统一的标准接口，以便UI组件实现时以复用的形式实现。

具体的，在本发明实施例中自定义组件特指UI组件，UI特指前端系统中的界面设计。

于本申请的一些实施例中，配置约定可以包括标准组件接口的UI组件的标识信息，例如UI组件的名称、版本等信息。

于本申请的一些实施例中，配置约定可以包括标准组件接口定义的参数具体格式，可以包括需要UI组件配置的参数信息，包括但是不限于支持自定义组件适配的参数信息，包括不限于可以适配的自定义UI组件的参数名称和类型、数据类型等，具体地，这些参数可供UI组件的使用者调整和配置，以改变UI组件的样式和状态。

于上述步骤100中，配置标准组件接口包括：获取自定义组件的要素集；根据要素集的配置信息，实现标准组件接口的初始化配置。可以理解的是，无论采用任何技术UI组件的所有包括内容几乎都以为归类为参数、状态、行为、插槽等要素集，将该部分的要素集进行归整可以实现自定义UI组件的所有定义内容最终与组件标准接口最终适配，因为该部分的要素集可以归整为作为标准组件接口的配置约定，实现用户在开发过程中，所有的UI组件的实现都可以基于该配置约定实现与标准组件接口的适配。

步骤200：创建自定义组件，自定义组件至少包括组件描述信息。可以理解的是，UI组件是构成UI界面的基本元素，其中，UI可以是软件的人机交互界面。UI组件可以是用户界面中的视图单元，UI设计的界面实现，通过用户自定义的UI组件实现最终页面的渲染，于标准组件接口中包括了UI组件的整合的要素集，于组件实现时，需要根据组件描述信息与标准组件接口进行进一步适配实现。

于本申请的一些实施例中,组件描述信息可以包括自定义组件的元信息，即为自定义组件的标识信息，例如自定义组件的名称、版本等信息。

于本申请的一些实施例中，组件描述信息可以包括组件可以配置的参数信息，这些参数信息可接收的类型有标准组件接口确定，最终参数的数值由UI组件的开发者调整和配置，以改变UI组件的样式和状态。例如，一个页面渲染结果最终实现的输入框的尺寸、默认值、是否被禁用等等，这些都应该是可配置的参数。

于本申请的一些实施例中，组件描述信息可以包括组件当前的状态，例如前端页面中显示的一个输入框当前输入的字符串，就是输入框组件的一个状态。

于本申请的一些实施例中，组件描述信息可以包括组件当前的正在发生的事件，事件是组件可以发出的事件。例如当前鼠标点击按钮，即为按钮发出的“点击”事件。具体地，当“点击”事件发出后，会调用一个窗口出现，该窗口对应与组件描述信息中的一个“方法”。

具体地，自定义组件描述信息中的“事件”与“方法”对应于一项完整的事件监听机制，方法为其它组件发出事件时，执行的方法调用，由其他组件来主动调用。例如，一个输入框组件具有“聚焦”的方法，其他组件调用这一方法后，就可以让输入框聚焦。

于本申请的一些实施例中，组件描述信息可以包括插槽，是组件预留给其他组件插入的位置，同一个组件可以有多个插槽，通过一个组件对应的多个插槽，使得组件的可扩性进一步提升。

步骤300：对组件描述信息进行解析，生成解析结果。可以理解的是，组件描述信息可以保留渲染结果的具体值，在自定义组件包括的组件描述信息应当于标准组件接口包括的要素集一一对应，通过将自定义组件的描述信息按照标准组件接口的参数进行详细解析，获取与标准组件接口一一对应的解析结果。

于上述步骤300中，解析组件描述信息包括：获取描述组件信息中的参数信息；获取自定义组件对应的全局状态树；根据全局状态树将参数信息转换为适配于标准组件接口的配置信息。可以理解的是，每个自定义组件接收的参数数值、类型等可能都是不同的，对于允许自定义组件传输的参数类型可以在标准组件接口中定义的，低代码引擎会读取自定义组件的组件描述信息中的具体参数数据，并结合当前的参数信息在自定组件库中全局状态树数据类型等进行处理转换适配标准组件接口，然后把这些参数数据传递给组件实现最终的页面渲染。

组件实现页面渲染时根据当前接收到参数数据，按照自定义组件自身的逻辑进行处理，具体逻辑因组件而异，本领域技术人员也可以根据自定义组件的类别等进行设置，在此不做限定。

具体地，参数信息是自定义组件可以配置的参数，这些参数可以随时调整和配置，以改变UI组件的样式和状态，例如，一个输入框的尺寸、默认值、是否被禁用等等，这些都应该是可配置的参数，本领域技术人员可以根据实际需要渲染的效果进行具体设定或者选择，在此不做限定。

于上述步骤300中，解析组件描述信息包括：获取组件描述信息中的状态标识；在存在自定义组件的第一状态更新为第二状态的情况下，将第二状态添加或者更新至自定义组件对应的全局状态树中；根据状态标识更新依赖于第一状态的自定义组件。可以理解的是，解析当前的自定义组件的标识，当前自定义组件库中所有的自定义组件的状态组成一个相应地自定义组件树，该自定义组件树上所有组件的状态均可以暴露至其他的组件，任一组件的状态发生变化时，均可实现自定义组件的响应式变化，具体指的是当自定义组件应用状态发生变化时，所有依赖该状态的UI都自动重写渲染，实现了一个高性能的响应式中心，所有组件都可以将自己的状态同步至其中以及实现从中访问的其他组件的状态，保证当前自定义组件的状态可以被其他的组件获取并及时更新。

具体地，低代码引擎会维护一个全局的状态树，其中包括了所有组件当前的状态，当其中的自定义组件的状态发生变化时，所有依赖这一状态的组件都会更新。

于本申请的实施例中，当自定义组件包括一个INPUT输入框时，该INPUT输入为空时，可以标记为第一状态，输入框输入相应的字符串后第一状态更新为第二状态，第二状态会将当前的更新状态暴露至其他所有的组件，依赖于当前INPUT输入框的其他组件、子组件实现响应式的更新操作，为了让组件能够暴露自身的状态，低代码引擎会实现一个函数，通过函数调用实现解析以供其调用，这个函数接收状态的名称和状态的值两个参数，进而获取输入框的第二状态，解析过程中只需调用了这个函数，便可以把自身的状态添加或更新到全局状态树中，从而实现暴露自身状态的目的，以便根据第二状态以最终实现触发其它自定义组件的事件、方法等状态的更新。

于上述步骤300中，解析组件描述信息包括：获取组件描述信息中的监听事件；根据触发的监听事件，调用自定义组件对应的全局方法库中的执行方法，实现监听事件和执行方法的映射。

于上述步骤300中，解析组件描述信息包括：获取组件描述信息的方法标识；根据方法标识将组件描述信息中的执行方法更新至自定义组件的全局方法库中。

于本申请的一些实施例中，组件的描述信息会声明需要监听的事件，以及事件发生时需要调用的组件的方法。低代码引擎会从全局方法库中找到对应的方法，并把它们添加到一个队列中，然后把事件标识例如事件名称和方法队列对应起来，获取解析结果，只需要在事件实际发生时，根据事件名称找到相应的方法队列，并一一调用方法即可。于本申请的一些实施例中，低代码引擎会维护一个全局的方法库，其中包括了所有组件暴露出来的方法，为了让组件能够暴露自身的方法，低代码引擎通过方法标识，包括方法的名称和执行方法的函数等实现方法的解析，并将将方法(以函数的形式)引入到全局的方法库中，以供低代码引擎执行。

具体地，执行事件监听首先读取事件和方法的名称，根据方法的名称、函数到组件注册到全局方法库中的方法的函数，收集方法所需要的参数，并且将参数和方法的函数一起封装成一个新的函数；函数的数量根据事件监听事项设定，一个事件可能会调用多个方法。建立事件需要调用的函数与事件的名称建立映射关系，即可以通过callBackMap传递，实现事件发生时直接执行函数实现自定义组件的解析。

于本申请的一些实施例中，低代码引擎会根据组件标识信息，解析组件描述信息，获取对应的组件实现来渲染整个前端页面，自定义组件实现渲染时无需考虑组件标识。

步骤400：将解析结果按照配置约定适配于标准组件接口，生成自定义组件的封装对象。可以理解的是，封装对象的类型可以有多种，包括但不限于图像组件(Image)、视图组件(View)、文本组件(Text)、图像视图组件(ImageView)、页面组件(Pager)、页面管理组件(Page Manager)、容器(Container)组件、滑动窗口组件(ScrollView)、帧组件(Frame)、列表组件(List)、网络组件(Network)等，通过将自定义组件中的组件描述信息进行解析按照配置约定与标准组件接口进行适配，将二者封装成可被调用的格式。

于本申请的一些实施例中，自定义组件本质上可以通过一个函数形式实现，低代码引擎会根据自定义组件所需的数据以函数的参数形式传递给当前自定义组件，包括但不限于组件参数、callbackMap、插槽中的子组件，以及subscribeMethods和mergeState两个函数，用以实现自定义组件注册自身方法和暴露自身状态。

步骤500：将自定义组件对应的封装对象引入至低代码开发工具中，实现页面渲染。可以理解的是，原本需要对应一个开发框架下多个UI组件库，多个接口实现Web UI,开发人员无需进行多个接口，多个UI组件库的重复设计，维护成本高，只需要拖拽组件，实现低代码工具和UI组件库的解耦，避免组件的冗余。

于本申请的一些实施例中，无需每个自定义组件都自行实现`dataUrl(获取数据的URL)`、`hidden(是否可见)`、`handlers(事件回调)`等属性，对于这类需求，开发人员以通用的能力实现并复用于多个自定义组件，从而保证组件实现的简洁。

于上述步骤100中，实现页面渲染包括：根据封装对象的组件标识，获取封装对象对应的自定义组件的组件树；获取封装对象中的组件插槽；根据组件树和组件插槽，依次实现页面渲染。可以理解的是，一部分组件之间有一定的关联例如包括类的继承，组合等关系，插槽的概念可以实现自定义样式的功能，组件的描述信息会声明自身所属的父组件的名称和插槽，低代码引擎启动时首先会读取全部的组件描述信息中的插槽信息，并根据其呈现的父子关系，构建一颗组件树。低代码引擎会根据组件树的顺序，由父到子依次执行组件渲染。低代码组件还会将组件的子组件传递给组件实现，这样组件就可以将子组件渲染到对应的插槽位置。

具体地，对于组件实现而言，它从低代码引擎中获取到了自己每个插槽中所对应的子组件。它只需要把子组件放到预留的插槽位置中。低代码引擎会负责子组件的渲染过程。整个组件树便是以这样递归的顺序依次渲染。

于本申请的一些实施例中，前端系统中一般通过相关的API接口与后端服务进行通信，例如获取数据进行展示或者提交用户数据等。UI组件可以是通过API接口的调用进行实现的。因此，UI组件可以与API接口具有一定的对应关系，这也是前端开发者进行界面设计时的依据。

在本发明实施例中，API接口的接口信息是进行API接口调用时所需的信息。例如，API接口的接口信息可以包括接口地址以及接口参数等。在进行UI组件代码生成时，可以进行API接口的模拟请求，即可以根据接口信息发起本地接口请求，确定对应的响应数据。例如，可以根据接口地址和接口参数，通过本地Node(一种运行环境)服务发起接口的HTTP请求，获取响应数据。其中，响应数据可以包括具体的响应的数据内容以及数据类型等。

API接口是一些预先定义的协议接口，如超文本传输协议(Hyper Text TransferProtocol，HTTP)。

具体地，将结合一个具体应用场景对本申请的自定义组件引入方法进一步地说明：

配置标准组件接口该标准组件接口支持Input输入框，其中配置约定具体包括：Input输入框的“properties”，具体可以为：`placeholder`和`disabled`基于用TypeBox声明的，适配自定义组件时暴露一个状态value给外部访问，在标准组件接口的行为实现，定义一个“updateValue”方法，允许外部更新自己的value值，该个Input会发出失焦(onBlur)事件，支持自定义组件的插槽包括：两个slot可以插入子组件，分别代表前缀和后缀，同时具备一个content的styleSlot，可以添加自定义样式。自定义组件进行解析后的结果是应该要接受标准组件接口中定义的`properties`，通过调用相应状态标识、事件标识、方法标识等函数，同时实现组件当前状态的获取及组件开发者能够将定义组件样式的能力对外暴露，组件的可复用性就将大大提，同时对于组件插槽内容并返回,实现自定义组件实现，最终通过与组件标准接口的共同封装，实现自定义组件引入低代码开发工具中，实现页面的渲染。

例如，组件的解析可包括：对于“callbackMap”是组件状态对外暴露事件的方式。它是一个事件名称和回调函数的Map。如果有其他自定义组件监听了某个其它自定义组件的Event，那么事件回调函数就会通过“callbackMap”传递给该自定义组件，在Event对应的代码的位置调用这个回调函数，这样其他的自定义组件才能成功监听该自定义组件的发生的事件。

图2根据本申请的实施例中，示出了一种自定义组件的引入系统，具体包括：

创建单元1，用于创建自定义组件，自定义组件至少包括组件描述信息；

解析单元2，用于对组件描述信息进行解析，生成解析结果；

配置单元3，用于配置标准组件接口，标准组件接口至少包括配置约定；

适配单元4，用于将解析结果按照配置约定适配于标准组件接口，生成自定义组件的封装对象；

渲染单元5，用于将自定义组件对应的封装对象引入至低代码开发工具中，实现页面渲染。

可以理解的是，上述自定义组件的引入系统各个功能模块执行与前述自定义组件的引入方法相同的步骤流程，在此不做赘述。

在本申请的一些实施例中，还提供了一种电子设备。该种电子设备中包含存储器和处理器，其中存储器用于对处理程序进行存储，处理器则根据指令对处理程序进行执行。当处理器对处理程序进行执行时，使得前述实施例中的自定义组件的引入方法得以实现。

本申请提出的技术方案涉及方法、装置、系统、电子设备、计算机可读存储介质和/或计算机程序产品。计算机程序产品可以包括用于执行本公开的各个方面的计算机可读程序指令。

计算机可读存储介质可以是可以保持和存储由指令执行设备使用的指令的有形设备。计算机可读存储介质例如可以是――但不限于――电存储设备、磁存储设备、光存储设备、电磁存储设备、半导体存储设备或者上述的任意合适的组合。计算机可读存储介质的更具体的例子(非穷举的列表)包括：便携式计算机盘、硬盘、随机存取存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(EPROM或闪存)、静态随机存取存储器(SRAM)、便携式压缩盘只读存储器(CD-ROM)、数字多功能盘(DVD)、记忆棒、软盘、机械编码设备、例如其上存储有指令的打孔卡或凹槽内凸起结构、以及上述的任意合适的组合。这里所使用的计算机可读存储介质不被解释为瞬时信号本身，诸如无线电波或者其他自由传播的电磁波、通过波导或其他传输媒介传播的电磁波(例如，通过光纤电缆的光脉冲)、或者通过电线传输的电信号。

这里所描述的计算机可读程序指令可以从计算机可读存储介质下载到各个计算/处理设备，或者通过网络、例如因特网、局域网、广域网和/或无线网下载到外部计算机或外部存储设备。网络可以包括铜传输电缆、光纤传输、无线传输、路由器、防火墙、交换机、网关计算机和/或边缘服务器。每个计算/处理设备中的网络适配卡或者网络接口从网络接收计算机可读程序指令，并转发该计算机可读程序指令，以供存储在各个计算/处理设备中的计算机可读存储介质中。

用于执行本公开操作的计算机程序指令可以是汇编指令、指令集架构(ISA)指令、机器指令、机器相关指令、微代码、固件指令、状态设置数据、或者以一种或多种编程语言的任意组合编写的源代码或目标代码，编程语言包括面向对象的编程语言—诸如Smalltalk、C++等，以及常规的过程式编程语言—诸如“C”语言或类似的编程语言。计算机可读程序指令可以完全地在用户计算机上执行、部分地在用户计算机上执行、作为一个独立的软件包执行、部分在用户计算机上部分在远程计算机上执行、或者完全在远程计算机或服务器上执行。在涉及远程计算机的情形中，远程计算机可以通过任意种类的网络—包括局域网(LAN)或广域网(WAN)—连接到用户计算机，或者，可以连接到外部计算机(例如利用因特网服务提供商来通过因特网连接)。在一些实施例中，通过利用计算机可读程序指令的状态信息来个性化定制电子电路，例如可编程逻辑电路、现场可编程门阵列(FPGA)或可编程逻辑阵列(PLA)，该电子电路可以执行计算机可读程序指令，从而实现本公开的各个方面。

这里参照根据本公开实施例的方法、装置(系统)和计算机程序产品的流程图和/或框图描述了本公开的各个方面。应当理解，流程图和/或框图的每个方框以及流程图和/或框图中各方框的组合，都可以由计算机可读程序指令实现。

这些计算机可读程序指令可以提供给通用计算机、专用计算机或其它可编程数据处理装置的处理单元，从而生产出一种机器，使得这些指令在通过计算机或其它可编程数据处理装置的处理单元执行时，产生了实现流程图和/或框图中的一个或多个方框中规定的功能/动作的装置。也可以把这些计算机可读程序指令存储在计算机可读存储介质中，这些指令使得计算机、可编程数据处理装置和/或其他设备以特定方式工作，从而，存储有指令的计算机可读介质则包括一个制造品，其包括实现流程图和/或框图中的一个或多个方框中规定的功能/动作的各个方面的指令。

也可以把计算机可读程序指令加载到计算机、其它可编程数据处理装置、或其它设备上，使得在计算机、其它可编程数据处理装置或其它设备上执行一系列操作步骤，以产生计算机实现的过程，从而使得在计算机、其它可编程数据处理装置、或其它设备上执行的指令实现流程图和/或框图中的一个或多个方框中规定的功能/动作。

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

以上已经描述了本公开的各实施例，上述说明是示例性的，并非穷尽性的，并且也不限于所披露的各实施例。在不偏离所说明的各实施例的范围和精神的情况下，对于本技术领域的普通技术人员来说许多修改和变更都是显而易见的。本文中所用术语的选择，旨在最好地解释各实施例的原理、实际应用或对市场中的技术改进，或者使本技术领域的其它普通技术人员能理解本文披露的各实施例。

Claims (8)

1.一种自定义组件的引入方法，其特征在于，所述的方法包括：

配置标准组件接口，所述标准组件接口至少包括配置约定；

创建自定义组件，所述自定义组件至少包括组件描述信息；

对所述组件描述信息进行解析，生成解析结果；

将所述解析结果按照所述配置约定适配于所述标准组件接口，生成所述自定义组件的封装对象；将所述自定义组件对应的所述封装对象引入至低代码开发工具中，实现页面渲染；

解析所述组件描述信息包括：

获取所述组件描述信息中的状态标识；

在存在所述自定义组件的第一状态更新为第二状态的情况下，将所述第二状态添加或者更新至所述自定义组件对应的全局状态树中；根据所述状态标识更新依赖于所述第一状态的所述自定义组件；

当前自定义组件库中所有的自定义组件的状态组成一个相应地自定义组件树，所述自定义组件树上所有组件的状态均能够暴露至其他的组件，存在任一组件的状态发生变化时，保证当前自定义组件的状态能够被其他的组件获取并及时更新；实现页面渲染包括：根据所述封装对象的组件标识，获取所述封装对象对应的所述自定义组件的组件树；

获取所述封装对象中的组件插槽；根据所述组件树和所述组件插槽，依次实现页面渲染。

2.根据权利要求1所述的一种自定义组件的引入方法，其特征在于，配置标准组件接口包括：

获取所述自定义组件的要素集；根据所述要素集的配置信息，实现所述标准组件接口的初始化配置。

3.根据权利要求1所述的一种自定义组件的引入方法，其特征在于，解析所述组件描述信息包括：获取所述组件描述信息中的参数信息；

获取所述自定义组件对应的全局状态树；根据所述全局状态树将所述参数信息转换为适配于所述标准组件接口的配置信息。

4.根据权利要求1所述的一种自定义组件的引入方法，其特征在于，解析所述组件描述信息包括：

获取所述组件描述信息中的监听事件；根据触发的所述监听事件，调用所述自定义组件对应的全局方法库中的执行方法，实现所述监听事件和所述执行方法的映射。

5.根据权利要求4所述的一种自定义组件的引入方法，其特征在于，解析所述组件描述信息包括：

获取所述组件描述信息的方法标识；根据所述方法标识将所述组件描述信息中的所述执行方法更新至自定义组件的全局方法库中。

6.一种自定义组件的引入系统，其特征在于，所述的系统包括：

配置单元，用于配置标准组件接口，所述标准组件接口至少包括配置约定；

创建单元，用于创建自定义组件，所述自定义组件至少包括组件描述信息；

解析单元，用于对所述组件描述信息进行解析，生成解析结果；

适配单元，用于将所述解析结果按照所述配置约定适配于所述标准组件接口，生成所述自定义组件的封装对象；

渲染单元，用于将所述自定义组件对应的所述封装对象引入至低代码开发工具中，实现页面渲染；解析所述组件描述信息包括：

获取所述组件描述信息中的状态标识；

在存在所述自定义组件的第一状态更新为第二状态的情况下，将所述第二状态添加或者更新至所述自定义组件对应的全局状态树中；

根据所述状态标识更新依赖于所述第一状态的所述自定义组件；当前自定义组件库中所有的自定义组件的状态组成一个相应地自定义组件树，所述自定义组件树上所有组件的状态均能够暴露至其他的组件，存在任一组件的状态发

生变化时，保证当前自定义组件的状态能够被其他的组件获取并及时更新；

实现页面渲染包括：

根据所述封装对象的组件标识，获取所述封装对象对应的所述自定义组件的组件树；

获取所述封装对象中的组件插槽；根据所述组件树和所述组件插槽，依次实现页面渲染。

7.一种电子设备，其特征在于，包括：

存储器，所述存储器用于存储处理程序；

处理器，所述处理器执行所述处理程序时实现如权利要求1至5中任意一项所述的自定义组件的引入方法。

8.一种可读存储介质，其特征在于，所述可读存储介质上存储有处理程序，所述处理程序被处理器执行时实现如权利要求1至5中任意一项所述的自定义组件的引入方法。

Images