CN116700691A - 前端组件的代码生成方法以及相关设备 - Google Patents

Abstract

本申请涉及金融科技领域，提供了一种前端组件的代码生成方法以及相关设备，该方法首先获取用户输入的组件生成信息，组件生成信息包括与目标组件构成元素对应的第一组件部件信息，之后对第一组件部件信息进行特征分析，得到第一组件特征信息，再将第一组件特征信息与多个预设前端组件进行特征对比，得到至少一个目标前端组件，最后获取目标前端组件的代码信息，并向所述用户发送目标前端组件的代码信息。本申请实施例获取用户上传的与组件构成元素对应的组件部件信息，根据对组件部件信息进行特征分析得到的组件特征，从组件构成元素层面在多个预设前端组件中匹配得到至少一个的目标前端组件，能够自动生成贴近用户需求的前端组件代码。

Description

前端组件的代码生成方法以及相关设备

技术领域

本申请涉及金融科技领域，尤其涉及一种前端组件的代码生成方法以及相关设备。

背景技术

随着计算机技术的发展，越来越多技术应用在金融领域，传统金融业正在逐步向金融科技转变，银行各业务系统在业务需求日益增长的情况下不断升级换代，如何快速研发金融软件产品以满足业务需求成为业内首要面临的问题，前端组件代码的自动生成是软件快速研发中一项极为重要的任务。

目前，银行各业务系统的前端组件代码生成方法主要是通过前端脚手架生成一种或多种固定模版的代码结构，开发人员在此结构上添加业务功能代码以完成组件代码开发。虽然这种代码生成方法在一定程度上可以降低开发人员的重复劳动，但由于组件代码是按某种固定模版生成的，很难针对特定场景需求生成贴近需求的组件代码。

发明内容

本申请实施例的主要目的在于提出一种前端组件的代码生成方法、装置、电子设备及计算机可读存储介质，能够自动生成贴近用户需求的前端组件代码。

为实现上述目的，本申请实施例的第一方面提出了一种前端组件的代码生成方法，所述方法包括：

获取用户输入的组件生成信息，所述组件生成信息包括与目标组件构成元素对应的第一组件部件信息；

对所述第一组件部件信息进行特征分析，得到第一组件特征信息；

将所述第一组件特征信息与多个预设前端组件进行特征对比，得到至少一个目标前端组件；

获取所述目标前端组件的代码信息，并向所述用户发送所述目标前端组件的代码信息。

根据本申请一些实施例提供的前端组件的代码生成方法，所述将所述第一组件特征信息与多个预设前端组件进行特征对比，得到至少一个目标前端组件，包括：

从预设的前端组件库中获取多个预设前端组件以及所述预设前端组件对应的第二组件特征信息；其中，所述第二组件特征信息为所述预设前端组件与所述目标组件构成元素对应的第二组件部件信息的特征信息；

将所述第一组件特征信息与所述第二组件特征信息进行对比处理，并根据对比结果得到至少一个目标前端组件。

根据本申请一些实施例提供的前端组件的代码生成方法，所述第一组件部件信息为第一组件视图，所述第二组件部件信息为第二组件视图，所述第二组件特征信息为第二图像特征向量；

所述对所述第一组件部件信息进行特征分析，得到第一组件特征信息，包括：

对所述第一组件视图进行图像特征提取，得到第一图像特征向量；

所述将所述第一组件特征信息与所述第二组件特征信息进行对比处理，并根据对比结果得到至少一个目标前端组件，包括：

对所述第一图像特征向量和所述第二图像特征向量进行相似度计算，得到所述第一组件视图和所述第二组件视图之间的图像相似度；

按照所述图像相似度从高到低，从所述前端组件库中选取排序靠前的至少一个所述预设前端组件作为目标前端组件。

根据本申请一些实施例提供的前端组件的代码生成方法，所述第一组件部件信息为第一组件描述文本，所述第二组件部件信息为第二组件描述文本，所述第二组件特征信息为第二文本特征向量；

所述对所述第一组件部件信息进行特征分析，得到第一组件特征信息，包括：

对所述第一组件描述文本进行文本特征提取，得到第一文本特征向量；

所述将所述第一组件特征信息与所述第二组件特征信息进行对比处理，并根据对比结果得到至少一个目标前端组件，包括：

对所述第一文本特征向量和所述第二文本特征向量进行相似度计算，得到所述第一组件描述文本与所述第二组件描述文本之间的文本相似度；

按照所述文本相似度从高到低，从所述前端组件库中选取排序靠前的至少一个所述预设前端组件作为目标前端组件。

根据本申请一些实施例提供的前端组件的代码生成方法，所述第一组件部件信息为第一组件描述文本，所述第二组件部件信息为第二组件描述文本，所述第二组件特征信息为第二文本信息；

所述对所述第一组件部件信息进行特征分析，得到第一组件特征信息，包括：

对所述第一组件描述文本进行信息提取处理，得到第一文本信息；

所述将所述第一组件特征信息与所述第二组件特征信息进行对比处理，并根据对比结果得到至少一个目标前端组件，包括：

对所述第一文本信息和所述第二文本信息进行匹配处理，得到所述第一文本信息和所述第二文本信息之间的文本匹配度；

按照所述文本匹配度从高到低，从所述前端组件库中选取排序靠前的至少一个所述预设前端组件作为目标前端组件。

根据本申请一些实施例提供的前端组件的代码生成方法，在所述从预设的前端组件库中获取多个预设前端组件以及所述预设前端组件对应的第二组件特征信息之前，所述方法还包括：

从预设的前端组件库中获取多个预设前端组件以及所述预设前端组件与所述目标组件构成元素对应的第二组件部件信息；

对所述第二组件部件信息进行特征分析，得到第二组件特征信息；

将所述第二组件特征信息存储至所述前端组件库。

根据本申请一些实施例提供的前端组件的代码生成方法，所述组件生成信息包括与多个目标组件构成元素对应的第一组件部件信息；

所述将所述第一组件特征信息与多个预设前端组件进行特征对比，得到至少一个目标前端组件，包括：

将所述第一组件特征信息与多个预设前端组件进行特征对比，得到各个所述目标组件构成元素对应的目标组件部件；

根据预设的组件部件结构对所述目标组件部件进行整合处理，得到至少一个目标前端组件。

为实现上述目的，本申请实施例的第二方面提出了一种前端组件的代码生成装置，所述装置包括：

获取模块，用于获取用户输入的组件生成信息，所述组件生成信息包括与目标组件构成元素对应的第一组件部件信息；

分析模块，用于对所述第一组件部件信息进行特征分析，得到第一组件特征信息；

对比模块，用于将所述第一组件特征信息与多个预设前端组件进行特征对比，得到至少一个目标前端组件；

发送模块，用于获取所述目标前端组件的代码信息，并向所述用户发送所述目标前端组件的代码信息。

为实现上述目的，本申请实施例的第三方面提出了一种电子设备，所述电子设备包括存储器、处理器、存储在所述存储器上并可在所述处理器上运行的计算机程序，所述计算机程序被所述处理器执行时实现上述第一方面所述的方法。

为实现上述目的，本申请实施例的第四方面提出了一种存储介质，所述存储介质为计算机可读存储介质，用于计算机可读存储，所述存储介质存储有一个或者多个计算机程序，所述一个或者多个计算机程序可被一个或者多个处理器执行，以实现上述第一方面所述的方法。

本申请提出一种前端组件的代码生成方法、装置、电子设备以及计算机可读存储介质，该方法首先获取用户输入的组件生成信息，组件生成信息包括与目标组件构成元素对应的第一组件部件信息，之后对第一组件部件信息进行特征分析，得到第一组件特征信息，再将第一组件特征信息与多个预设前端组件进行特征对比，得到至少一个目标前端组件，最后获取目标前端组件的代码信息，并向所述用户发送目标前端组件的代码信息。本申请实施例获取用户上传的与组件构成元素对应的组件部件信息，根据对组件部件信息进行特征分析得到的组件特征，从组件构成元素层面在多个预设前端组件中匹配得到至少一个的目标前端组件，能够自动生成贴近用户需求的前端组件代码。

本申请实施例提供的前端组件的代码生成方法可以应用于金融科技领域中，该代码生成方法首先获取开发人员输入的组件生成信息，该组件生成信息为银行业务系统中的前端页面需求信息，组件生成信息包括与目标组件构成元素对应的第一组件部件信息，再将第一组件特征信息与多个预设前端组件进行特征对比，得到至少一个目标前端组件，最后获取目标前端组件的代码信息并将代码信息发送给开发人员，通过获取开发人员上传的与组件构成元素对应的组件部件信息，对组件部件信息进行特征分析得到组件特征，之后在组件构成元素层面根据组件特征在多个预设前端组件中匹配得到至少一个目标前端组件，并将目标前端组件的代码信息发送给开发人员，自动生成贴近开发者需求的前端组件代码，能够生成更加贴近银行业务系统中的特定业务场景需求的前端组件代码。

附图说明

图1是本申请实施例提供的一种前端组件的代码生成方法的流程示意图；

图2是图1中步骤S130的子步骤流程示意图；

图3是图2中步骤S220的子步骤流程示意图；

图4是图2中步骤S220的子步骤流程示意图；

图5是图2中步骤S220的子步骤流程示意图；

图6是本申请另一实施例提供的一种前端组件的代码生成方法的流程示意图；

图7是图1中步骤S130的子步骤流程示意图；

图8是本申请实施例提供的一种前端组件的代码生成装置的结构示意图；

图9是本申请实施例提供的一种电子设备的硬件结构示意图。

具体实施方式

为了使本申请的目的、技术方案及优点更加清楚明白，以下结合附图及实施例，对本申请进行进一步详细说明。应当理解，此处所描述的具体实施例仅用以解释本申请，并不用于限定本申请。

需要说明的是，除非另有定义，本文所使用的所有的技术和科学术语与属于本申请的技术领域的技术人员通常理解的含义相同。本文中所使用的术语只是为了描述本申请实施例的目的，不是旨在限制本申请。

首先，对本申请中涉及的若干名词进行解析：

人工智能(artificial intelligence，AI)：是研究、开发用于模拟、延伸和扩展人的智能的理论、方法、技术及应用系统的一门新的技术科学；人工智能是计算机科学的一个分支，人工智能企图了解智能的实质，并生产出一种新的能以人类智能相似的方式做出反应的智能机器，该领域的研究包括机器人、语言识别、图像识别、自然语言处理和专家系统等。人工智能可以对人的意识、思维的信息过程的模拟。人工智能还是利用数字计算机或者数字计算机控制的机器模拟、延伸和扩展人的智能，感知环境、获取知识并使用知识获得最佳结果的理论、方法、技术及应用系统。

自然语言处理(natural language processing，NLP)：NLP用计算机来处理、理解以及运用人类语言(如中文、英文等)，NLP属于人工智能的一个分支，是计算机科学与语言学的交叉学科，又常被称为计算语言学。自然语言处理包括语法分析、语义分析、篇章理解等。自然语言处理常用于机器翻译、手写体和印刷体字符识别、语音识别及文语转换、信息意图识别、信息抽取与过滤、文本分类与聚类、舆情分析和观点挖掘等技术领域，它涉及与语言处理相关的数据挖掘、机器学习、知识获取、知识工程、人工智能研究和与语言计算相关的语言学研究等。

信息提取(Information Extraction)：从自然语言文本中抽取指定类型的实体、关系、事件等事实信息，并形成结构化数据输出的文本处理技术。信息抽取是从文本数据中抽取特定信息的一种技术。文本数据是由一些具体的单位构成的，例如句子、段落、篇章，文本信息正是由一些小的具体的单位构成的，例如字、词、词组、句子、段落或是这些具体的单位的组合。抽取文本数据中的名词短语、人名、地名等都是文本信息抽取，当然，文本信息抽取技术所抽取的信息可以是各种类型的信息。

随着计算机技术的发展，越来越多技术应用在金融领域，传统金融业正在逐步向金融科技转变，银行各业务系统在业务需求日益增长的情况下不断升级换代，如何快速研发金融软件产品以满足业务需求成为业内首要面临的问题，前端组件代码的自动生成是软件快速研发中一项极为重要的任务。

目前，银行各业务系统的前端组件代码生成方法主要是通过前端脚手架生成一种或多种固定模版的代码结构，开发人员在此结构上添加业务功能代码以完成组件代码开发。虽然这种代码生成方法在一定程度上可以降低开发人员的重复劳动，但由于组件代码是按某种固定模版生成的，很难针对特定场景需求生成贴近需求的组件代码。

基于此，本申请实施例提供了一种前端组件的代码生成方法、装置、电子设备及计算机可读存储介质，能够自动生成贴近用户需求的前端组件代码。

首先描述本申请实施例中的前端组件的代码生成方法：

本申请实施例可以基于人工智能技术对相关的数据进行获取和处理。其中，人工智能(Artificial Intelligence，AI)是利用数字计算机或者数字计算机控制的机器模拟、延伸和扩展人的智能，感知环境、获取知识并使用知识获得最佳结果的理论、方法、技术及应用系统。

人工智能基础技术一般包括如传感器、专用人工智能芯片、云计算、分布式存储、大数据处理技术、操作/交互系统、机电一体化等技术。人工智能软件技术主要包括计算机视觉技术、机器人技术、生物识别技术、语音处理技术、自然语言处理技术以及机器学习/深度学习等几大方向。

本申请实施例提供的前端组件的代码生成方法可应用于终端中，也可应用于服务器端中，还可以是运行于终端或服务器端中的软件。在一些实施例中，终端可以是智能手机、平板电脑、笔记本电脑、台式计算机等；服务器端可以配置成独立的物理服务器，也可以配置成多个物理服务器构成的服务器集群或者分布式系统，还可以配置成提供云服务、云数据库、云计算、云函数、云存储、网络服务、云通信、中间件服务、域名服务、安全服务、CDN以及大数据和人工智能平台等基础云计算服务的云服务器；软件可以是实现前端组件的代码生成方法的应用等，但并不局限于以上形式。

本申请可用于众多通用或专用的计算机系统环境或配置中。例如：个人计算机、服务器计算机、手持设备或便携式设备、平板型设备、多处理器系统、基于微处理器的系统、置顶盒、可编程的消费电子设备、网络PC、小型计算机、大型计算机、包括以上任何系统或设备的分布式计算环境等等。本申请可以在由计算机执行的计算机可执行指令的一般上下文中描述，例如程序模块。一般地，程序模块包括执行特定任务或实现特定抽象数据类型的例程、程序、对象、组件、数据结构等等。也可以在分布式计算环境中实践本申请，在这些分布式计算环境中，由通过通信网络而被连接的远程处理设备来执行任务。在分布式计算环境中，程序模块可以位于包括存储设备在内的本地和远程计算机存储介质中。

请参见图1，图1示出了本申请实施例提供的一种前端组件的代码生成方法的流程示意图，如图1所示，该前端组件的代码生成方法包括但不限于步骤S110至步骤S140：

步骤S110，获取用户输入的组件生成信息，所述组件生成信息包括与目标组件构成元素对应的第一组件部件信息；

步骤S120，对所述第一组件部件信息进行特征分析，得到第一组件特征信息；

步骤S130，将所述第一组件特征信息与多个预设前端组件进行特征对比，得到至少一个目标前端组件；

步骤S140，获取所述目标前端组件的代码信息，并向所述用户发送所述目标前端组件的代码信息。

可以理解的是，根据前端组件设计方法论，前端组件的组件构成元素包括视图、逻辑、通信、交互以及模型等。用户输入的组件生成信息包括了与视图、逻辑、通信、交互以及模型中至少之一的目标组件构成元素对应的第一组件部件信息。

应能理解的是，若第一组件部件信息为文本信息，则可以通过预设的语言算法模型执行相应的自然语言处理任务，例如进行语义、词法/词性等方面的分析，又或者进行命名实体识别、标签提取、核心词/关键词提取；若第一组件部件为图像信息，则可以通过预设的图像算法模型执行相应的图像处理任务，例如进行特征提取获取图像特征，又或者进行OCR图像识别获取图像中的文字信息。

在一些实施例中，请参见图2，图2示出了图1中步骤S130的子步骤流程示意图，如图2所示，步骤S130包括但不限于步骤S210和步骤S220：

步骤S210，从预设的前端组件库中获取多个预设前端组件以及所述预设前端组件对应的第二组件特征信息；

其中，所述第二组件特征信息为所述预设前端组件与所述目标组件构成元素对应的第二组件部件信息的特征信息；

步骤S220，将所述第一组件特征信息与所述第二组件特征信息进行对比处理，并根据对比结果得到至少一个目标前端组件。

可以理解的是，在得到第一组件部件信息对应的第一组件特征信息之后，从预先创建的前端组件库中获取多个预设前端组件以及该预设前端组件对应的第二组件特征信息。需要说明的是，该前端组件库中的预设前端组件根据前端组件设计方法论进行代码开发，且前端组件库存储有各个预设前端组件与视图、逻辑、通信、交互以及模型等组件构成元素对应的组件部件信息以及每个组件部件信息对应的特征信息，第二组件特征信息即为预设前端组件与目标组件构成元素对应的第二组件部件信息的特征信息。

示例性的，目标组件构成元素为组件模型，用户上传的组件生成信息包括第一组件模型，则对第一组件模型进行特征分析，得到第一模型特征信息，则从预设的前端组件库中获取多个预设前端组件以及该预设前端组件对应的第二模型特征信息，之后将第一模型特征信息与第二模型特征信息进行对比处理，根据对比结果确定与组件模型相似度靠前的至少一个预设前端组件作为目标前端组件。

第一组件特征信息为与组件构成元素对应的组件部件的特征信息，之后通过将第一组件特征信息与第二组件特征信息进行对比处理，可以得到符合组件生成信息的至少一个目标前端组件，能够自动生成更贴近需求的前端组件代码。

在一些实施例中，所述第一组件部件信息为第一组件视图，所述第二组件部件信息为第二组件视图，所述第二组件特征信息为第二图像特征向量；

所述对所述第一组件部件信息进行特征分析，得到第一组件特征信息，包括：

对所述第一组件视图进行图像特征提取，得到第一图像特征向量；

请参见图3，图3示出了图2中步骤S220的子步骤流程示意图，如图3所示，所述将所述第一组件特征信息与所述第二组件特征信息进行对比处理，并根据对比结果得到至少一个目标前端组件，包括但不限于步骤S310和步骤S320：

步骤S310，对所述第一图像特征向量和所述第二图像特征向量进行相似度计算，得到所述第一组件视图和所述第二组件视图之间的图像相似度；

步骤S320，按照所述图像相似度从高到低，从所述前端组件库中选取排序靠前的至少一个所述预设前端组件作为目标前端组件。

可以理解的是，目标组件构成元素为组件视图，用户上传的组件生成信息包括第一组件视图，从前端组件库中获取多个预设前端组件以及该预设前端组件对应的第二图像特征向量，第二图像特征向量为预设前端组件与目标组件构成元素对应的第二组件视图的特征信息。

对于第一组件视图，通过图像特征提取得到如颜色特征、纹理特征、湘子特征、空间关系特征等第一图像特征向量。从而根据预设的图像相似度算法对第一图像特征向量和第二图像特征向量进行图像相似度计算，得到第一组件视图和第二组件视图之间的图像相似度，最后按照图像相似度从高到低，选取排序靠前的至少一个预设前端组件作为目标前端组件。

通过对第一组件部件信息进行图像特征分析，能够从视图层面匹配前端组件，提高生成前端组件代码的灵活性。

在另一个具体实施例中，所述第一组件部件信息为第一组件视图，所述第二组件部件信息为第二组件视图，所述第二组件特征信息为第二图像文字信息；

所述对所述第一组件部件信息进行特征分析，得到第一组件特征信息，包括：

对所述第一组件视图进行文字识别处理，得到第一图像文字信息；

所述将所述第一组件特征信息与所述第二组件特征信息进行对比处理，并根据对比结果得到至少一个目标前端组件，包括：

将所述第一图像文字信息与所述第二图像文字信息进行匹配处理，得到图像文字匹配度；

按照所述图像文字匹配度从高到低，从所述前端组件库中选取排序靠前的至少一个所述预设前端组件作为目标前端组件。

可以理解的是，当目标组件构成元素为组件视图，也就是用户上传的组件生成信息包括第一组件视图时，还可以通过图像文字识别，如OCR技术从第一组件视图中提取视图中的文字信息，并与多个预设前端组件进行对比。

通过对第一组件部件信息进行文字识别处理，能够从图像文字层面匹配前端组件，提高生成前端组件代码的灵活性。

在一些实施例中，所述第一组件部件信息为第一组件描述文本，所述第二组件部件信息为第二组件描述文本，所述第二组件特征信息为第二文本特征向量；

所述对所述第一组件部件信息进行特征分析，得到第一组件特征信息，包括：

对所述第一组件描述文本进行文本特征提取，得到第一文本特征向量；

请参见图4，图4示出了图2中步骤S220的子步骤流程示意图，如图4所示，所述将所述第一组件特征信息与所述第二组件特征信息进行对比处理，并根据对比结果得到至少一个目标前端组件，包括但不限于步骤S410和步骤S420：

步骤S410，对所述第一文本特征向量和所述第二文本特征向量进行相似度计算，得到所述第一组件描述文本与所述第二组件描述文本之间的文本相似度；

步骤S420，按照所述文本相似度从高到低，从所述前端组件库中选取排序靠前的至少一个所述预设前端组件作为目标前端组件。

可以理解的是，目标组件构成元素可以是组件的逻辑、通信、交互或模型结构等文本信息，从前端组件库中获取多个预设前端组件以及该预设前端组件对应的第二文本特征向量，第二文本特征向量为预设前端组件与目标组件构成元素对应的第二组件描述文本的特征信息。

对第一组件描述文本，通过自然语言处理如语义分析、词法/词性分析，得到第一组件描述文本对应的第一文本特征向量。从而根据文本相似度算法对第一文本特征向量和第二文本特征向量进行文本相似度计算，得到第一组件描述文本和第二组件描述文本之间的文本相似度，最后按照文本相似度从高到低，选取排序靠前的至少一个预设前端组件作为目标前端组件。

通过对第一组件部件信息进行文字特征分析，能够从文本特征层面匹配前端组件，提高生成前端组件代码的灵活性。

在一些实施例中，所述第一组件部件信息为第一组件描述文本，所述第二组件部件信息为第二组件描述文本，所述第二组件特征信息为第二文本信息；

所述对所述第一组件部件信息进行特征分析，得到第一组件特征信息，包括：

对所述第一组件描述文本进行信息提取处理，得到第一文本信息；

请参见图5，图5示出了图2中步骤S220的子步骤流程示意图，如图5所示，所述将所述第一组件特征信息与所述第二组件特征信息进行对比处理，并根据对比结果得到至少一个目标前端组件，包括但不限于步骤S510和步骤S520：

步骤S510，对所述第一文本信息和所述第二文本信息进行匹配处理，得到所述第一文本信息和所述第二文本信息之间的文本匹配度；

步骤S520，按照所述文本匹配度从高到低，从所述前端组件库中选取排序靠前的至少一个所述预设前端组件作为目标前端组件。

可以理解的是，目标组件构成元素可以是组件的逻辑、通信、交互或模型结构等文本信息，从前端组件库中获取多个预设前端组件以及该预设前端组件对应的第二文本信息，第二文本信息为预设前端组件与目标组件构成元素对应的第二组件描述文本的关键词、核心词等。

对第一组件描述文本，通过信息提取得到第一组件描述文本对应的第一文本信息。从而根据预设的文本匹配算法对第一文本信息和第二文本信息进行匹配处理，得到第一文本信息和第二文本信息之间的文本匹配度，最后按照文本匹配度从高到低，选取排序靠前的至少一个预设前端组件作为目标前端组件。

通过对第一组件部件信息进行信息提取，能够从文本信息层面匹配前端组件，提高生成前端组件代码的灵活性。

示例性的，在上述实施例中，目标组件构成元素为组件的模型结构(数据结构)，第一组件描述文本为第一模型结构信息，通过对第一模型结构信息进行信息提取，得到模型结构中的字段名、字段类型以及字段描述等文本信息。

在一些实施例中，请参见图6，图6示出了本申请另一实施例提供的一种前端组件的代码生成方法的流程示意图，如图6所示，在所述从预设的前端组件库中获取多个预设前端组件以及所述预设前端组件对应的第二组件特征信息之前，所述方法还包括但不限于步骤S610至步骤S630：

步骤S610，从预设的前端组件库中获取多个预设前端组件以及所述预设前端组件与所述目标组件构成元素对应的第二组件部件信息；

步骤S620，对所述第二组件部件信息进行特征分析，得到第二组件特征信息；

步骤S630，将所述第二组件特征信息存储至所述前端组件库。

可以理解的是，在从预设的前端组件库中获取多个预设前端组件以及预设前端组件对应的第二组件特征信息之前，需要先从前端组件库中获取预设前端组件与目标组件构成元素对应的第二组件部件信息，之后再对第二组件部件信息进行特征分析，得到第二组件特征信息，最后把第二组件特征存储至前端组件库中，以使在特征对比处理时，能够直接从前端组件库中获取各个预设前端组件对应的第二组件特征信息，提高代码生成的响应速度。

在一些实施例中，所述组件生成信息包括与多个目标组件构成元素对应的第一组件部件信息；

请参见图7，图7示出了本申请另一实施例提供的一种前端组件的代码生成方法的流程示意图，如图7所示，所述将所述第一组件特征信息与多个预设前端组件进行特征对比，得到至少一个目标前端组件，包括但不限于步骤S710和步骤S710：

步骤S710，将所述第一组件特征信息与多个预设前端组件进行特征对比，得到各个所述目标组件构成元素对应的目标组件部件；

步骤S720，根据预设的组件部件结构对所述目标组件部件进行整合处理，得到至少一个目标前端组件。

应能理解的是，当用户上传的组件生成信息包括有对应多个目标组件构成元素对应的第一组件部件信息时，通过将第一组件特征信息与多个预设前端组件进行特征对比，得到各个目标组件构成元素对应的目标组件部件。

示例性的，前端组件库中预设前端组件的开发和子逻辑的开发均是按照一定的规则命名、按照规定的代码结构存放代码(文件夹结构)、按照标准结构规范开发，该代码结构如下：

Src

----view

----代码片段A

----model

----代码片段B

----controller

----代码片段C

其中，代码片段A用于生成组件视图，代码片段B表征组件模型结构，代码片段C表征组件逻辑，因此，选择不同的代码片段A、B和C并按照预设的组件代码结构规则就可以组装成一个新的前端组件。

用户上传的组件生成信息包括与组件构成元素：组件视图、组件模型结构和组件逻辑对应的三个第一组件部件信，通过对上述三个第一组件部件信息分别进行特征分析，得到三个组件特征信息，依次根据上述三个组件特征信息从预设的前端组件库中的预设前端组件进行特征对比，找出组件视图、组件模型结构和组件逻辑三个组件构成元素对应的、相似度最高的三个组件部件，最后按照组件设计规范、代码规范、代码结构等规则整合三个组件部件，得到目标前端组件。

基于与组件构成元素对应的组件部件信息，从多个预设前端组件中匹配得到组件构成元素对应的目标组件部件，之后根据预设的组件部件结构将目标组件部件进行整合处理得到目标前端组件，能够更加灵活地生成贴近用户需求、代码粒度更小的前端组件代码。

下面以生成银行业务系统中金融业务操作界面的前端组件代码为例描述本申请提供的一种前端组件的代码生成方法：

由前端组件代码生成系统执行代码生成方法，该代码生成系统中预先创建有前端组件库，前端组件库中包括多个预设前端组件，预设前端组件用于构建金融业务操作界面，包括如金融业务操作界面中的输入框、按钮模块、业务展示模块，且该预设前端组件均符合前端组件设计方法论，即所有组件均由视图、逻辑、通信、交互以及模型结构等组件构成元素组合而成。

银行业务系统的开发人员上传组件开发信息到代码生成系统中，包括组件视图信息、组件逻辑信息、组件通信方式信息、组件交互信息以及组件模型结构信息，对组件视图信息、组件逻辑信息、组件通信方式信息、组件交互信息以及组件模型结构信息分别进行文本、语意、结构和图像等特征分析，得到多个组件特征，将分析得到的多个组件特征与前端组件库中的预设前端组件进行对比，得到在各个组件构成元素上最相似的多个目标前端组件。

若在各个组件构成元素未能匹配到相似度较高的完整组件，则通过原子信息匹配对比的方式，将组件视图、组件逻辑、组件通信方式、组件交互以及组件模型结构分别与前端组件库中的组件进行匹配，分别找出在各个组件构成元素上对应的相似度最高的目标组件部件，按照预设的组件部件结构将多个目标组件部件的代码片段进行整合成一个新的组件，开发人员可以选择使用完整组件或仅使用目标组件部件的代码片段，通过获取开发人员由金融业务操作界面确定的组件开发信息，基于组件开发信息以特征匹配的方法从前端组件库中获取相应的组件代码，能够生成更加贴近银行业务系统中金融业务操作界面的前端组件代码。

本申请提出一种前端组件的代码生成方法，该方法首先获取用户输入的组件生成信息，组件生成信息包括与目标组件构成元素对应的第一组件部件信息，之后对第一组件部件信息进行特征分析，得到第一组件特征信息，再将第一组件特征信息与多个预设前端组件进行特征对比，得到至少一个目标前端组件，最后获取目标前端组件的代码信息，并向所述用户发送目标前端组件的代码信息。本申请实施例获取用户上传的与组件构成元素对应的组件部件信息，根据对组件部件信息进行特征分析得到的组件特征，从组件构成元素层面在多个预设前端组件中匹配得到至少一个的目标前端组件，能够自动生成贴近用户需求的前端组件代码。

请参见图8，本申请实施例还提供了一种前端组件的代码生成装置100，该前端组件的代码生成装置100包括：

获取模块110，用于获取用户输入的组件生成信息，所述组件生成信息包括与目标组件构成元素对应的第一组件部件信息；

分析模块120，用于对所述第一组件部件信息进行特征分析，得到第一组件特征信息；

对比模块130，用于将所述第一组件特征信息与多个预设前端组件进行特征对比，得到至少一个目标前端组件；

发送模块140，用于获取所述目标前端组件的代码信息，并向所述用户发送所述目标前端组件的代码信息。

本申请提出一种前端组件的代码生成装置，该装置首先通过获取模块获取用户输入的组件生成信息，组件生成信息包括与目标组件构成元素对应的第一组件部件信息，之后通过分析模块对第一组件部件信息进行特征分析，得到第一组件特征信息，再通过对比模块将第一组件特征信息与多个预设前端组件进行特征对比，得到至少一个目标前端组件，最后由发送模块获取目标前端组件的代码信息，并向所述用户发送目标前端组件的代码信息。本申请实施例获取用户上传的与组件构成元素对应的组件部件信息，根据对组件部件信息进行特征分析得到的组件特征，从组件构成元素层面在多个预设前端组件中匹配得到至少一个的目标前端组件，能够自动生成贴近用户需求的前端组件代码。

需要说明的是，上述装置的模块之间的信息交互、执行过程等内容，由于与本申请方法实施例基于同一构思，其具体功能及带来的技术效果，具体可参见方法实施例部分，此处不再赘述。

请参见图9，图9示出本申请实施例提供的一种电子设备的硬件结构，电子设备包括：

处理器210，可以采用通用的CPU(Central Processing Unit，中央处理器)、微处理器、应用专用集合成电路(Application Specific Integrated Circuit，ASIC)、或者一个或多个集合成电路等方式实现，用于执行相关计算机程序，以实现本申请实施例所提供的技术方案；

存储器220，可以采用只读存储器(Read Only Memory，ROM)、静态存储设备、动态存储设备或者随机存取存储器(Random Access Memory，RAM)等形式实现。存储器220可以存储操作系统和其他应用程序，在通过软件或者固件来实现本说明书实施例所提供的技术方案时，相关的程序代码保存在存储器220中，并由处理器210来调用执行本申请实施例的前端组件的代码生成方法；

输入/输出接口230，用于实现信息输入及输出；

通信接口240，用于实现本设备与其他设备的通信交互，可以通过有线方式(例如USB、网线等)实现通信，也可以通过无线方式(例如移动网络、WIFI、蓝牙等)实现通信；和总线250，在设备的每个组件(例如处理器210、存储器220、输入/输出接口230和通信接口240)之间传输信息；

其中处理器210、存储器220、输入/输出接口230和通信接口240通过总线250实现彼此之间在设备内部的通信连接。

本申请实施例还提供了一种存储介质，存储介质为计算机可读存储介质，用于计算机可读存储，存储介质存储有一个或者多个计算机程序，一个或者多个计算机程序可被一个或者多个处理器执行，以实现上述前端组件的代码生成方法。

存储器作为一种计算机可读存储介质，可用于存储软件程序以及计算机可执行程序。此外，存储器可以包括高速随机存取存储器，还可以包括非暂态存储器，例如至少一个磁盘存储器件、闪存器件、或其他非暂态固态存储器件。在一些实施方式中，存储器可选包括相对于处理器远程设置的存储器，这些远程存储器可以通过网络连接至该处理器。上述网络的实例包括但不限于互联网、企业内部网、局域网、移动通信网及其组合。

本申请实施例描述的实施例是为了更加清楚的说明本申请实施例的技术方案，并不构成对于本申请实施例提供的技术方案的限定，本领域技术人员可知，随着技术的演变和新应用场景的出现，本申请实施例提供的技术方案对于类似的技术问题，同样适用。

以上所描述的装置实施例仅仅是示意性的，其中作为分离部件说明的单元可以是或者也可以不是物理上分开的，即可以位于一个地方，或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部模块来实现本实施例方案的目的。

本领域普通技术人员可以理解，上文中所公开方法中的全部或某些步骤、系统、设备中的功能模块/单元可以被实施为软件、固件、硬件及其适当的组合。

在上述实施例中，对各个实施例的描述都各有侧重，某个实施例中没有详述或记载的部分，可以参见其它实施例的相关描述。

本申请的说明书及上述附图中的术语“第一”、“第二”、“第三”、“第四”等(如果存在)是用于区别类似的对象，而不必用于描述特定的顺序或先后次序。应该理解这样使用的数据在适当情况下可以互换，以便这里描述的本申请的实施例能够以除了在这里图示或描述的那些以外的顺序实施。此外，术语“包括”和“具有”以及他们的任何变形，意图在于覆盖不排他的包含，例如，包含了一系列步骤或单元的过程、方法、系统、产品或设备不必限于清楚地列出的那些步骤或单元，而是可包括没有清楚地列出的或对于这些过程、方法、产品或设备固有的其它步骤或单元。

应当理解，在本申请中，“至少一个(项)”是指一个或者多个，“多个”是指两个或两个以上。“和/或”，用于描述关联对象的关联关系，表示可以存在三种关系，例如，“A和/或B”可以表示：只存在A，只存在B以及同时存在A和B三种情况，其中A，B可以是单数或者复数。字符“/”一般表示前后关联对象是一种“或”的关系。“以下至少一项(个)”或其类似表达，是指这些项中的任意组合，包括单项(个)或复数项(个)的任意组合。例如，a，b或c中的至少一项(个)，可以表示：a，b，c，“a和b”，“a和c”，“b和c”，或“a和b和c”，其中a，b，c可以是单个，也可以是多个。

在本申请所提供的几个实施例中，应该理解到，所揭露的装置和方法，可以通过其它的方式实现。例如，以上所描述的装置实施例仅仅是示意性的，例如，上述单元的划分，仅仅为一种逻辑功能划分，实际实现时可以有另外的划分方式，例如多个单元或组件可以结合或者可以集合成到另一个系统，或一些特征可以忽略，或不执行。另一点，所显示或讨论的相互之间的耦合或直接耦合或通信连接可以是通过一些接口，装置或单元的间接耦合或通信连接，可以是电性，机械或其它的形式。

上述作为分离部件说明的单元可以是或者也可以不是物理上分开的，作为单元显示的部件可以是或者也可以不是物理单元，即可以位于一个地方，或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部单元来实现本实施例方案的目的。

另外，在本申请每个实施例中的各功能单元可以集合成在一个处理单元中，也可以是每个单元单独物理存在，也可以两个或两个以上单元集合成在一个单元中。上述集合成的单元既可以采用硬件的形式实现，也可以采用软件功能单元的形式实现。

集合成的单元如果以软件功能单元的形式实现并作为独立的产品销售或使用时，可以存储在一个计算机可读取存储介质中。基于这样的理解，本申请的技术方案本质上或者说对现有技术做出贡献的部分或者该技术方案的全部或部分可以以软件产品的形式体现出来，该计算机软件产品存储在一个存储介质中，包括多指令用以使得一台计算机设备(可以是个人计算机，服务器，或者网络设备等)执行本申请每个实施例的方法的全部或部分步骤。而前述的存储介质包括：U盘、移动硬盘、只读存储器(Read-Only Memory，简称ROM)、随机存取存储器(Random Access Memory，简称RAM)、磁碟或者光盘等各种可以存储程序的介质。

以上参照附图说明了本申请实施例的优选实施例，并非因此局限本申请实施例的权利范围。本领域技术人员不脱离本申请实施例的范围和实质内所作的任何修改、等同替换和改进，均应在本申请实施例的权利范围之内。

Claims (10)

1.一种前端组件的代码生成方法，其特征在于，所述方法包括：

获取用户输入的组件生成信息，所述组件生成信息包括与目标组件构成元素对应的第一组件部件信息；

对所述第一组件部件信息进行特征分析，得到第一组件特征信息；

将所述第一组件特征信息与多个预设前端组件进行特征对比，得到至少一个目标前端组件；

获取所述目标前端组件的代码信息，并向所述用户发送所述目标前端组件的代码信息。

2.根据权利要求1所述的方法，其特征在于，所述将所述第一组件特征信息与多个预设前端组件进行特征对比，得到至少一个目标前端组件，包括：

从预设的前端组件库中获取多个预设前端组件以及所述预设前端组件对应的第二组件特征信息；其中，所述第二组件特征信息为所述预设前端组件与所述目标组件构成元素对应的第二组件部件信息的特征信息；

将所述第一组件特征信息与所述第二组件特征信息进行对比处理，并根据对比结果得到至少一个目标前端组件。

3.根据权利要求2所述的方法，其特征在于，所述第一组件部件信息为第一组件视图，所述第二组件部件信息为第二组件视图，所述第二组件特征信息为第二图像特征向量；

所述对所述第一组件部件信息进行特征分析，得到第一组件特征信息，包括：

对所述第一组件视图进行图像特征提取，得到第一图像特征向量；

所述将所述第一组件特征信息与所述第二组件特征信息进行对比处理，并根据对比结果得到至少一个目标前端组件，包括：

对所述第一图像特征向量和所述第二图像特征向量进行相似度计算，得到所述第一组件视图和所述第二组件视图之间的图像相似度；

按照所述图像相似度从高到低，从所述前端组件库中选取排序靠前的至少一个所述预设前端组件作为目标前端组件。

4.根据权利要求2所述的方法，其特征在于，所述第一组件部件信息为第一组件描述文本，所述第二组件部件信息为第二组件描述文本，所述第二组件特征信息为第二文本特征向量；

所述对所述第一组件部件信息进行特征分析，得到第一组件特征信息，包括：

对所述第一组件描述文本进行文本特征提取，得到第一文本特征向量；

所述将所述第一组件特征信息与所述第二组件特征信息进行对比处理，并根据对比结果得到至少一个目标前端组件，包括：

对所述第一文本特征向量和所述第二文本特征向量进行相似度计算，得到所述第一组件描述文本与所述第二组件描述文本之间的文本相似度；

按照所述文本相似度从高到低，从所述前端组件库中选取排序靠前的至少一个所述预设前端组件作为目标前端组件。

5.根据权利要求2所述的方法，其特征在于，所述第一组件部件信息为第一组件描述文本，所述第二组件部件信息为第二组件描述文本，所述第二组件特征信息为第二文本信息；

所述对所述第一组件部件信息进行特征分析，得到第一组件特征信息，包括：

对所述第一组件描述文本进行信息提取处理，得到第一文本信息；

所述将所述第一组件特征信息与所述第二组件特征信息进行对比处理，并根据对比结果得到至少一个目标前端组件，包括：

对所述第一文本信息和所述第二文本信息进行匹配处理，得到所述第一文本信息和所述第二文本信息之间的文本匹配度；

按照所述文本匹配度从高到低，从所述前端组件库中选取排序靠前的至少一个所述预设前端组件作为目标前端组件。

6.根据权利要求2所述的方法，其特征在于，在所述从预设的前端组件库中获取多个预设前端组件以及所述预设前端组件对应的第二组件特征信息之前，所述方法还包括：

从预设的前端组件库中获取多个预设前端组件以及所述预设前端组件与所述目标组件构成元素对应的第二组件部件信息；

对所述第二组件部件信息进行特征分析，得到第二组件特征信息；

将所述第二组件特征信息存储至所述前端组件库。

7.根据权利要求1所述的方法，其特征在于，所述组件生成信息包括与多个目标组件构成元素对应的第一组件部件信息；

所述将所述第一组件特征信息与多个预设前端组件进行特征对比，得到至少一个目标前端组件，包括：

将所述第一组件特征信息与多个预设前端组件进行特征对比，得到各个所述目标组件构成元素对应的目标组件部件；

根据预设的组件部件结构对所述目标组件部件进行整合处理，得到至少一个目标前端组件。

8.一种前端组件的代码生成装置，其特征在于，所述装置包括：

获取模块，用于获取用户输入的组件生成信息，所述组件生成信息包括与目标组件构成元素对应的第一组件部件信息；

分析模块，用于对所述第一组件部件信息进行特征分析，得到第一组件特征信息；

对比模块，用于将所述第一组件特征信息与多个预设前端组件进行特征对比，得到至少一个目标前端组件；

发送模块，用于获取所述目标前端组件的代码信息，并向所述用户发送所述目标前端组件的代码信息。

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

至少一个处理器；以及，

与所述至少一个处理器通信连接的存储器；其中，

所述存储器存储有计算机程序，所述计算机程序被所述至少一个处理器执行，以使所述至少一个处理器能够执行如权利要求1至7中任一项所述的方法。

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