一种组件相互嵌套调用和渲染的方法技术

本发明专利技术公开了一种组件相互嵌套调用和渲染的方法，包括以下步骤：S1：首先编写好包括判断模块的组件A和判断模块的组件B，同时挂载预构建一个自开发的Vue组件；S2：S1中的组件A和组件B均按照统一的标准，可以接收外部传入的标准配置，另外组件A和组件B均能解析标准配置，根据配置内容，将所述自开发Vue组件中的各个组件分为不同的类型，建立name

【技术实现步骤摘要】
一种组件相互嵌套调用和渲染的方法


[0001]本专利技术涉及组件嵌套调用和渲染
，尤其涉及一种组件相互嵌套调用和渲染的方法。

技术介绍

[0002]日益增长的个性化的软件需求孕育而生的低代码对技术要求越来越高，针对低代码技术中组件渲染调用问题以及组件与组件之间的调用问题，我们提出了一种组件相互嵌套调用和渲染的方法。

技术实现思路

[0003]基于
技术介绍
存在的技术问题，本专利技术提出了一种组件相互嵌套调用和渲染的方法。
[0004]本专利技术提出的一种组件相互嵌套调用和渲染的方法，包括以下步骤：
[0005]S1：首先编写好包括判断模块的组件A和判断模块的组件B，同时挂载预构建一个自开发的Vue组件；
[0006]S2：S1中的组件A和组件B均按照统一的标准，可以接收外部传入的标准配置，另外组件A和组件B均能解析标准配置，根据配置内容，将所述自开发Vue组件中的各个组件分为不同的类型，建立name
‑
component的映射关系，并处理自开发Vue组件中的全局组件；
[0007]S3：通过组件A、组件B以及Vue组件中的各个组件的类型和name在name
‑
component的映射关系中找到指定的组件的定义，然后通过render或component的方式加载组件A和组件B，进行渲染组件；
[0008]S4：获取组件A的源程序，该源程序中包括接口声明标记，接口声明标记用于声明标记接口函数允许被组件B调用，标记接口函数为组件A的源程序中被接口声明标记所标记过的接口函数，同时组件B内部同样额外设定了被组件A的调用；
[0009]S5：S2中的组件A和组件B的标准配置内容同时约定了一个特殊的子配置，如children节点，子配置里面同样还可以包含下一级children节点；
[0010]S6：组件A接收到配置之后，组件A首先通过其自身来对节点进行识别，并通过组件A的判断模块来对节点进行逐一判断是否是children节点，如果是children节点，则启用对组件B的调用，同时截取children节点配置当作对组件B的参数配置传给组件B；
[0011]S7：S6中的组件B接收到配置，解析配置并渲染组件，此时如果接收到配置内部包含了节点配置，组件B首先通过其自身来对节点进行识别，并通过组件B的判断模块来对节点进行逐一判断是否是children节点，如果是children节点，组件B则启用对组件A的调用，同时截取所包含的children节点配置再传给组件A，如此这般，组件A和组件B之间就行成了无限循环调用渲染的功能。
[0012]优选地，所述S1中，组件A和组件B均采用传统的方法进行编写，其中自开发的Vue组件的构建过程包括以下步骤：
[0013]S001：根据需要下载对应的脚手架，通过该脚手架下载对应的Vue组件模版；
[0014]S002：在S001中所述的Vue组件模版的开发目录下完成各个组件的开发，并统一导出Vue文件；
[0015]S003：将S002中导出的Vue文件打包，并上传至预设的路径下，并根据该路径进行自开发Vue组件的挂载。
[0016]优选地，所述S3中，render函数的参数为createElement，其具有三个参数，一个为HTML标签名、组件选项对象，其类型为{String|Object|Function}，一个为模版中attribute对应的数据对象，其类型为{Object}，另一个为子级虚拟节点(VNodes)，由createElement()构建而成，也可以使用字符串来生成“文本虚拟节点”，其类型为{String|Array}。
[0017]优选地，所述S3中，通过component方式加载组件的具体方式为：通过Vue中的动态组件component的is属性传递组件的定义，其调用Component构造器指定组件的属性、数据、方法等，从而进行渲染。
[0018]优选地，所述S5中，子配置同样保持和标准的配置一致。
[0019]优选地，所述S6和S7中，组件A或组件B对接收的配置进行处理的步骤如下：
[0020]S001：对接收的配置进行全面检索，进行获取全部的节点；
[0021]S002：将S001中所获取的全部节点进行识别；
[0022]S003：利用判断模块中的判断函数：F(X)是否为children节点来对S002中所识别的节点进行逐个依次判断，如果F(X)不是children节点，则依次对下个节点进行判断，如果是children节点，则进行下一步。
[0023]优选地，所述S4中，组件A的接口声明标记包括第一类标记和第二类标记，其中第一类标记用于声明标记接口函数允许被其他设备上的B组件调用，第二类标记用于声明所述标记接口函数允许被本设备上的B组件调用，同理组件B的接口声明标记与组件A相同，其同样包括第一类标记和第二类标记，其中第一类标记用于声明标记接口函数允许被其他设备上的A组件调用，第二类标记用于声明所述标记接口函数允许被本设备上的A组件调用。
[0024]与现有的技术相比，本专利技术可以使得组件与组件之间可以无限相互调用，组件均有自己独特的渲染逻辑和效果，达到个性渲染目的的同时，又可以相互嵌套调用。
附图说明
[0025]图1为本专利技术提出的一种组件相互嵌套调用和渲染的方法中组件A和组件B的连接示意图。
具体实施方式
[0026]下面结合具体实施例对本专利技术作进一步解说。
[0027]实施例
[0028]参照图1，本实施例提出了一种组件相互嵌套调用和渲染的方法，包括以下步骤：
[0029]S1：首先采用传统的方法进行编写好组件A和组件B，且组件A和组件B均采用传统的方法进行编写，同时挂载预构建一个自开发的Vue组件，其中自开发的Vue组件的构建过程包括以下步骤：
[0030]S001：根据需要下载对应的脚手架，通过该脚手架下载对应的Vue组件模版；
[0031]S002：在S001中的Vue组件模版的开发目录下完成各个组件的开发，并统一导出Vue文件；
[0032]S003：将S002中导出的Vue文件打包，并上传至预设的路径下，并根据该路径进行自开发Vue组件的挂载；
[0033]S2：S1中的组件A和组件B均按照统一的标准，可以接收外部传入的标准配置，另外组件A和组件B均能解析标准配置，根据配置内容，将自开发Vue组件中的各个组件分为不同的类型，建立name
‑
component的映射关系，并处理自开发Vue组件中的全局组件；
[0034]S3：通过组件A、组件B以及Vue组件中的各个组件的类型和name在name
‑
component的映射关系中找到指定的组件的定义，然后通过render或component的方式加载组件A和组件B，进行渲染组件，其中render函数的参数为crea本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种组件相互嵌套调用和渲染的方法，其特征在于，包括以下步骤：S1：首先编写好包括判断模块的组件A和判断模块的组件B，同时挂载预构建一个自开发的Vue组件；S2：S1中的组件A和组件B均按照统一的标准，可以接收外部传入的标准配置，另外组件A和组件B均能解析标准配置，根据配置内容，将所述自开发Vue组件中的各个组件分为不同的类型，建立name
‑
component的映射关系，并处理自开发Vue组件中的全局组件；S3：通过组件A、组件B以及Vue组件中的各个组件的类型和name在name
‑
component的映射关系中找到指定的组件的定义，然后通过render或component的方式加载组件A和组件B，进行渲染组件；S4：获取组件A的源程序，该源程序中包括接口声明标记，接口声明标记用于声明标记接口函数允许被组件B调用，标记接口函数为组件A的源程序中被接口声明标记所标记过的接口函数，同时组件B内部同样额外设定了被组件A的调用；S5：S2中的组件A和组件B的标准配置内容同时约定了一个特殊的子配置，如children节点，子配置里面同样还可以包含下一级children节点；S6：组件A接收到配置之后，组件A首先通过其自身来对节点进行识别，并通过组件A的判断模块来对节点进行逐一判断是否是children节点，如果是children节点，则启用对组件B的调用，同时截取children节点配置当作对组件B的参数配置传给组件B；S7：S6中的组件B接收到配置，解析配置并渲染组件，此时如果接收到配置内部包含了节点配置，组件B首先通过其自身来对节点进行识别，并通过组件B的判断模块来对节点进行逐一判断是否是children节点，如果是children节点，组件B则启用对组件A的调用，同时截取所包含的children节点配置再传给组件A，如此这般，组件A和组件B之间就行成了无限循环调用渲染的功能。2.根据权利要求1所述的一种组件相互嵌套调用和渲染的方法，其特征在于，所述S1中，组件A和组件B均采用传统的方法进行编写，其中自开发的Vue组件的构建过程包括以下步骤：S001：根据需要下载对应的脚手架，通过该脚手架下载对应的Vue组件模版；S002：在S001中所述的Vue组件模版的开发目...

【专利技术属性】
技术研发人员：陈明清，农海彬，
申请(专利权)人：广东飞企互联科技股份有限公司，
类型：发明
国别省市：