用户界面框架适配渲染方法、装置、设备和存储介质与流程

1.本技术属于前端开发技术领域，特别是涉及一种用户界面框架适配渲染方法、用户界面框架适配渲染装置、计算机设备和计算机可读存储介质。


背景技术：

2.现有业内对不同ui(user interface，用户界面)框架的处理方案是，按照不同ui框架进行不同的代码编写。然而，现有的ui框架都是独立生态体系，无法相互兼容。这种开发方法虽然会提高开发端的开发效率，但是产品上线时可能会存在因开发端和用户端ui框架不兼容，导致用户端处无法对ui框架进行渲染。需要通过独立改造维护一个新组建，导致无法解决高效开发，择优即用的能力。因此如何提高ui框架的在用户端加载渲染时的可用性，是本领域技术人员亟待解决的技术问题。
3.前面的叙述在于提供一般的背景信息，并不一定构成现有技术。


技术实现要素：

4.基于此，有必要针对上述问题，提出了一种用户界面框架适配渲染方法、用户界面框架适配渲染装置、计算机设备和计算机可读存储介质，能够解决用户端和开发端采用不同用户界面框架所导致的兼容性问题。
5.本技术解决其技术问题是采用以下的技术方案来实现的：
6.本技术提供了一种用户界面框架适配渲染方法，包括如下步骤：获取第一用户界面代码，第一用户界面代码中包括有第一框架信息，第一框架信息用于表征开发端开发用户界面所使用的用户界面框架；获取用户界面渲染器的第二框架信息，第二框架信息用于表征用户端用户界面渲染器渲染用户界面所使用的用户界面框架；当第一框架信息和第二框架信息不匹配时，对第一用户界面代码执行动态匹配操作以将第一用户界面代码处理为第二用户界面代码，第二用户界面代码的框架信息与第二框架信息匹配；将第二用户界面代码发送至用户端，以使用户界面渲染器对第二用户界面代码进行处理，以完成用户界面的渲染生成。
7.在本技术一可选实施例中，第一框架信息和第二框架信息不匹配，包括：第一框架信息和第二框架信息表征二者框架类型不同；或，当第一框架信息和第二框架信息表征二者框架类型相同时，获取第一框架信息的第一版本信息和第二框架信息的第二版本信息，第一版本信息和第二版本信息不兼容。
8.在本技术一可选实施例中，当第一版本信息和第二版本信息不兼容时，对第一用户界面代码执行动态匹配操作以将第一用户界面代码处理为第二用户界面代码，包括：根据第一版本信息和第二版本信息获取更新补丁；通过对第一用户界面代码安装更新补丁，以得到第二用户界面代码。
9.在本技术一可选实施例中，对第一用户界面代码执行动态匹配操作以将第一用户界面代码处理为第二用户界面代码，包括：将第一用户界面代码和第二框架信息注入预先
构建的框架匹配模型；框架匹配模型根据第一框架信息和第二框架信息确定匹配关系；根据匹配关系处理第一用户界面代码以得到第二用户界面代码。
10.在本技术一可选实施例中，框架匹配模型包括标签匹配器、方法匹配器和样式匹配器；根据匹配关系处理第一用户界面代码以得到第二用户界面代码，包括：标签匹配器提取出第一用户界面代码中的第一标签，并将第一标签转化为第二标签，第二标签为通用格式的标签形式；根据匹配关系处理第二标签以得到第三标签，第三标签为用户界面渲染器能够处理的形式；方法匹配器提取出第一用户界面代码中的第一方法，并将第一方法转化为第二方法，第二方法为通用格式的方法形式；根据匹配关系处理第二方法以得到第三方法，第三方法为用户界面渲染器能够处理的形式；样式匹配器提取出第一用户界面代码中的第一样式，根据匹配关系处理第一方法以得到第二样式，第二样式为用户端适用的界面形式；汇总第三标签、第三方法和第二样式，以得到第二用户界面代码。
11.在本技术一可选实施例中，根据匹配关系处理第一用户界面代码以得到第二用户界面代码，包括：根据匹配关系获取配置参数；利用配置参数对第一用户界面代码进行设置，以得到第二用户界面代码。
12.在本技术一可选实施例中，用户界面渲染器对第二用户界面代码进行处理，包括：用户界面渲染器获取执行动态匹配操作中生成的匹配参数信息，并根据第二框架信息确定用户界面渲染器渲染用户界面需采用的渲染引擎；渲染引擎根据匹配参数信息对第二用户界面代码进行解析以完成用户界面的渲染生成。
13.本技术还提供了一种用户界面框架适配渲染装置，包括：获取模块，用于获取第一用户界面代码，第一用户界面代码中包括有第一框架信息，第一框架信息用于表征开发端开发用户界面所使用的用户界面框架；获取用户界面渲染器的第二框架信息，第二框架信息用于表征用户端用户界面渲染器渲染用户界面所使用的用户界面框架；适配模块，用于当第一框架信息和第二框架信息不匹配时，对第一用户界面代码执行动态匹配操作以将第一用户界面代码处理为第二用户界面代码，第二用户界面代码的框架信息与第二框架信息匹配；渲染模块，用于将第二用户界面代码发送至用户端，以使用户界面渲染器对第二用户界面代码进行处理，以完成用户界面的渲染生成。
14.本技术还提供了一种计算机设备，包括处理器和存储器：处理器用于执行存储器中存储的计算机程序以实现如前述的方法。
15.本技术还提供了一种计算机可读存储介质，存储有计算机程序，当计算机程序被处理器执行时实现如前述的方法。
16.采用本技术实施例，具有如下有益效果：
17.本技术能够在渲染用户框架之前，先行确定开发端的开发第一用户界面代码所使用的用户界面框架，与用户端用户界面渲染器渲染用户界面所使用的用户界面框架，两个框架间是否匹配。从而在不匹配时通过动态匹配操作将第一用户界面代码转化为能够被用户端用户界面渲染器渲染使用的第二用户界面代码。因此实现了ui框架的灵活统一，使得用户界面框架切换将更加简单便捷，无需重构多套交互用户界面，大大提高了生产效率，降低人力投入成本。
18.上述说明仅是本技术技术方案的概述，为了能够更清楚了解本技术的技术手段，而可依照说明书的内容予以实施，并且为了让本技术的上述和其他目的、特征和优点能够
更明显易懂，以下特举较佳实施例，并配合附图，详细说明。应当理解的是，以上的一般描述和后文的细节描述仅是示例性和解释性的，并不能限制本技术。
附图说明
19.为了更清楚地说明本技术实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本技术的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。
20.其中：
21.图1为一实施例提供的一种用户界面框架适配渲染方法的流程示意图；
22.图2为一实施例提供的框架匹配模型的架构示意图；
23.图3为一实施例提供的框架匹配模型处理第一用户界面代码的示意图；
24.图4为一实施例提供的一种用户界面框架适配渲染装置的结构示意框图；
25.图5为一实施例提供的一种计算机设备的结构示意框图。
具体实施方式
26.下面将结合本技术实施例中的附图，对本技术实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本技术一部分实施例，而不是全部的实施例。基于本技术中的实施例，本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例，都属于本技术保护的范围。
27.现有的ui框架都是独立生态体系，无法相互兼容。如果存在需求提出更换ui框架，将要对全局进行ui框架规范的重写，这将极大地增加开发成本将。所以导致前端架构在一开始选定ui框架后不会轻易调整ui框架。如果ui框架停止维护会对项目造成极大影响。现在低代码编辑器的开发需要依赖于某一ui框架，所以会导致要使用该低代码编辑器的产物需要项目使用该低代码使用的基于某ui框架的规范来进行编辑。会造成效果不统一，项目工程规模变大，不利于开发等问题。如何解决ui框架的并行、切换、兼容等问题，本技术提出了一种用户界面框架适配渲染方法的流程示意图为了清楚描述本实施例提供的一种用户界面框架适配渲染方法的流程示意图，请参考图1～图3，包括有步骤s110～s130。
28.步骤s110：获取第一用户界面代码，第一用户界面代码中包括有第一框架信息，第一框架信息用于表征开发端开发用户界面所使用的用户界面框架；获取用户界面渲染器的第二框架信息，第二框架信息用于表征用户端用户界面渲染器渲染用户界面所使用的用户界面框架。
29.在一实施方式中，作为前端的用户端可以获取作为后端的开发端的第一用户界面代码，也即是开发端完成开发的低代码。其中，第一用户界面代码中包括有第一框架信息，第一框架信息用于表征开发端开发ui所使用的ui框架。同时还需要获取用户端的所使用的用户界面渲染器的第二框架信息。用户界面渲染器也即是处理开发端的代码，实现ui渲染、生成的引擎。并且渲染ui同样必须基于某一ui框架，对于所采用的ui框架记录在第二框架信息中。
30.步骤s120：当第一框架信息和第二框架信息不匹配时，对第一用户界面代码执行
动态匹配操作以将第一用户界面代码处理为第二用户界面代码，第二用户界面代码的框架信息与第二框架信息匹配。
31.在一实施方式中，如果第一框架信息和第二框架信息匹配，也即是说用户界面渲染器能够处理第一用户界面代码的，便可以直接完成ui的生成。如果不匹配，从结果上就是用户端的用户界面渲染器无法处理第一用户界面代码的，就需要对第一用户界面代码进行处理，以保证ui的正常生成。并且可以理解的是，结果上无法渲染，所会导致如此原因则多种多样，不同的原因则可以适配不同的解决方案，此将会在后文中详细描述。
32.在一实施方式中，第一框架信息和第二框架信息不匹配，包括：第一框架信息和第二框架信息表征二者框架类型不同；或，当第一框架信息和第二框架信息表征二者框架类型相同时，获取第一框架信息的第一版本信息和第二框架信息的第二版本信息，第一版本信息和第二版本信息不兼容。
33.在一实施方式中，前文所述的第一框架信息和第二框架信息不匹配的情况，具体可以包括两种：不同框架间的不兼容，以及同种框架间的版本不相容。对于前者则可以直接根据第一框架信息和第二框架信息的比对进行确定：确定第一框架信息对应的版本类型，假设是a框架，和第二框架信息对应的版本类型，假设是b框架。如果a框架不等同b框架，则可以进一步获取兼容性映射表，确定b框架能够兼容a框架开发的第一用户界面代码，如果b框架不能兼容，则认为定第一框架信息和第二框架信息不匹配。对于此种情况，则需要对第一用户界面代码进行转换，以转换为b框架能够处理的形式，具体转换将会在后文中展开。对于不匹配的第二种情况，则可以属于是根据第一框架信息和第二框架信息确定a框架和b框架为同一框架，再获取a框架的第一版本信息，b框架的第二版本信息，即分别获取各自的版本号。确定b框架的版本能否兼容a框架版本所开发的第一用户界面代码，如果不能(一般而言是b框架的版本低于a框架的版本)，则同样可以认定为第一框架信息和第二框架信息不匹配。对于此情况，则可以不需要转换，需要对第一用户界面代码做简单的升降级操作，即可完成兼容。同样的对于升降级操作将会在后文中详述，此处暂不展开。
34.在一实施方式中，当第一版本信息和第二版本信息不兼容时，步骤s120：对第一用户界面代码执行动态匹配操作以将第一用户界面代码处理为第二用户界面代码，包括：根据第一版本信息和第二版本信息获取更新补丁；通过对第一用户界面代码安装更新补丁，以得到第二用户界面代码。
35.在一实施方式中，本实施方式延续前文第一版本信息和第二版本信息不兼容的情况进行说明。对于第一版本信息和第二版本信息确定二者为采取了同一用户框架，然而具体而言的第一版本信息和第二版本信息不兼容的情况。在此情况下，可以根据第一版本信息和第二版本信息获取更新补丁，也即根据二者的版本号，确定第一用户界面代码要在第二版本信息对应的ui框架下运行的所需要执行的升降级内容，此也即更新补丁所涵盖的内容。在确定获取好所需要的更新补丁后，则可在第一用户界面代码内安装该更新补丁，进而完成相应的升降级操作。升降级之后所得到的更新后的代码也即第二用户界面代码，第二用户界面代码便可以在第二版本信息对应的ui框架被编译以渲染为所需要的ui。
36.在一实施方式中，步骤s120：对第一用户界面代码执行动态匹配操作以将第一用户界面代码处理为第二用户界面代码，包括：将第一用户界面代码和第二框架信息注入预先构建的框架匹配模型；框架匹配模型根据第一框架信息和第二框架信息确定匹配关系；
根据匹配关系处理第一用户界面代码以得到第二用户界面代码。
37.在一实施方式中，如果第一框架信息和第二框架信息不匹配的情况具体为ui框架间的不匹配，则需要对第一用户界面代码进行转码操作了，该操作在本技术实施例中可以称为动态匹配操作。对于该操作首先需要确定第一框架信息和第二框架信息间的匹配关系，从而定向地完成匹配和转换。并且可以理解的是转换和开发可以使用html等标签，遵循w3c规则(world wide web consortium，万维网协会规则)、javascript等规则。框架匹配模型具体架构可以参考图2，图2为标签匹配器的架构示意图。可见框架匹配模型20包括有标签匹配器21、方法匹配器22和样式匹配器23，对于各自实现的功能，将会在后文中详细描述，此处暂不展开。
38.在一实施方式中，框架匹配模型包括标签匹配器、方法匹配器和样式匹配器。根据匹配关系处理第一用户界面代码以得到第二用户界面代码，包括：标签匹配器提取出第一用户界面代码中的第一标签，并将第一标签转化为第二标签，第二标签为通用格式的标签形式；根据匹配关系处理第二标签以得到第三标签，第三标签为用户界面渲染器能够处理的形式；方法匹配器提取出第一用户界面代码中的第一方法，并将第一方法转化为第二方法，第二方法为通用格式的方法形式；根据匹配关系处理第二方法以得到第三方法，第三方法为用户界面渲染器能够处理的形式；样式匹配器提取出第一用户界面代码中的第一样式，根据匹配关系处理第一方法以得到第二样式，第二样式为用户端适用的界面形式；汇总第三标签、第三方法和第二样式，以得到第二用户界面代码。
39.在一实施方式中，对于框架匹配模型20处理第一用户界面代码的示意图，可以参考图3。如图3所示，需要将第一用户界面代码和第二框架信息注入框架匹配模型20中得到匹配关系。再将第一用户界面代码分别送入框架匹配模型20中的标签匹配器21、方法匹配器22和样式匹配器23中，以使得各个匹配器能够根据进行处理，并且利用匹配关系对第一用户界面代码进行处理，从而最终汇总得到第二用户界面代码。
40.在本实施方式中，为便于说明，设定第一用户界面代码采用vue ui框架，用户界面渲染器采用element ui框架进行说明。标签匹配器21在收到第一用户界面代码后，会提取出第一用户界面代码中的第一标签，第一标签为第一用户界面代码内所采用的标签形式。例如对于一个输入组件，在vue ui框架中的代码为：
41.《v-text-field v-model＝"username"label＝"用户名"》《/v-text-field》
42.其中的v-text-field组件来实现input的功能，也即《/v-text-field》对应第一标签。则可以首先将输入属性的该第第一表现转为通用形式的《input》格式，也即第二标签。对于第二标签，则根据匹配关系确定用户渲染器所使用的element ui框架进行匹配转换，以可以转化为如下格式：
43.《el-input v-model＝"form.username"placeholder＝"请输入用户名"》《/el-input》
44.其中《/el-input》则是完成转化后的第三标签的格式。可见，以输入标签为例，标签匹配器21能够将第一用户界面代码中的第一标签《/v-text-field》先转换为通用形式的《input》，再转为element ui框架中输入标签对应的《/el-input》格式。并且可以基于对象数组遍历的模式进行扫描，将第一用户界面代码中的所有标签进行转换，从而实现了标签的统一。
45.同样的，对于方法匹配器22提取出第一用户界面代码中的第一方法，第一方法为第一用户界面代码中运行格式的方法。并首先将第一方法转化为通用形式的第二方法。再将第二方法按照约定规则进行方法绑定，例如匹配关系，通过es6(ecmascript 6，javascript的一种标准)及以上方法结合前端框架规则通过ref，emit，eventlistener等属性进行绑定挂载，并透过回调函数方式进行方法传递及参数配置，从而完成根据匹配关系处理第二方法以得到第三方法的处理过程。第三方法为用户界面渲染器能够处理的形式。
46.样式匹配器23则用于样式的转换。同样的，样式匹配器23先取出第一用户界面代码中的第一样式，根据匹配关系处理第一方法以得到第二样式，第二样式为用户端适用的界面形式。样式通过采用打包min等压缩文件或者cdn(content delivery network，内容分发网络)等方式使用第一样式。对第一样式的特殊改写问题，例如修改组件的默认样式、调整组件的布局等等，则可使用设置优先级更高的本地index.css规则为主。对于样式转换的过程较为现有，本技术便不再赘述。最后将转换完成的第三标签、第三方法和第二样式进行汇总，以得到第二用户界面代码。
47.在一实施方式中，根据匹配关系处理第一用户界面代码以得到第二用户界面代码，包括：根据匹配关系获取配置参数；利用配置参数对第一用户界面代码进行设置，以得到第二用户界面代码。
48.在一实施方式中，前文通过框架匹配模型20处理第一用户界面代码的过程是自动配置的过程，在其中还可以进行手动的配置。可以理解的是自动配置适用于绝大所述常用代码的转化，但是开发过程难免存在特殊情况。因此对于存在特殊情况的可以根据匹配关系获取配置参数，配置参数用于表征需要对第一用户界面代码进行设置的参数。再经由开发者或用户可以手动对第一用户界面代码进行设置，以实现对部分特殊代码的变更、转换。完成手动配置的第一用户界面代码也即第二用户界面代码。
49.步骤s130：将第二用户界面代码发送至用户端，以使用户界面渲染器对第二用户界面代码进行处理，以完成用户界面的渲染生成。
50.在一实施方式中，步骤s130：用户界面渲染器对第二用户界面代码进行处理，包括：用户界面渲染器获取执行动态匹配操作中生成的匹配参数信息，并根据第二框架信息确定用户界面渲染器渲染用户界面需采用的渲染引擎；渲染引擎根据匹配参数信息对第二用户界面代码进行解析以完成用户界面的渲染生成。
51.在一实施方式中，用户界面渲染器在对第二用户界面代码进行处理的过程中，可以获取之前执行动态匹配操作生成的匹配参数信息。再结合第二框架信息确定用户界面渲染器渲染用户界面需采用的渲染引擎，例如可以ui框架按照渲染规则选择用户界面渲染器内不同的渲染引擎进行解析。将html标签，js，css等w3c规则，根据以匹配关系包括的匹配规则进行映射，并记忆存储规则信息与本地缓存或者渲染服务器中。映射规则后，通过前端框架进行即可编译生成相对应的交互界面。
52.因此，本技术能够能够在渲染用户框架之前，先行确定开发端的开发第一用户界面代码所使用的用户界面框架，与用户端用户界面渲染器渲染用户界面所使用的用户界面框架，两个框架间是否匹配。从而在不匹配时通过动态匹配操作将第一用户界面代码转化为能够被用户端用户界面渲染器渲染使用的第二用户界面代码。因此实现了ui框架的灵活统一，使得用户界面框架切换将更加简单便捷，无需重构多套交互用户界面，大大提高了生
产效率，降低人力投入成本。
53.图4示出了一个实施例中一种用户界面框架适配渲染装置的结构示意框图。用户界面框架适配渲染装置40，包括：获取模块41、适配模块42、渲染模块43。获取模块41，用于获取第一用户界面代码，第一用户界面代码中包括有第一框架信息，第一框架信息用于表征开发端开发用户界面所使用的用户界面框架；获取用户界面渲染器的第二框架信息，第二框架信息用于表征用户端用户界面渲染器渲染用户界面所使用的用户界面框架。适配模块42，用于当第一框架信息和第二框架信息不匹配时，对第一用户界面代码执行动态匹配操作以将第一用户界面代码处理为第二用户界面代码，第二用户界面代码的框架信息与第二框架信息匹配。渲染模块43，用于将第二用户界面代码发送至用户端，以使用户界面渲染器对第二用户界面代码进行处理，以完成用户界面的渲染生成。
54.图5示出了一个实施例中计算机设备的结构示意框图。该计算机设备具体可以是终端，也可以是服务器。如图5所示，该计算机设备包括通过系统总线连接的处理器、存储器和网络接口。其中，存储器包括非易失性存储介质和内存储器。该计算机设备的非易失性存储介质存储有操作系统，还可存储有计算机程序，该计算机程序被处理器执行时，可使得处理器实现用户界面框架适配渲染方法。该内存储器中也可储存有计算机程序，该计算机程序被处理器执行时，可使得处理器执行用户界面框架适配渲染方法。本领域技术人员可以理解，图5中示出的结构，仅仅是与本技术方案相关的部分结构的框图，并不构成对本技术方案所应用于其上的计算机设备的限定，具体的计算机设备可以包括比图中所示更多或更少的部件，或者组合某些部件，或者具有不同的部件布置。
55.在一个实施例中，本技术还提出了一种计算机可读存储介质，存储有计算机程序，计算机程序被处理器执行时，使得处理器执行如前述方法的步骤，
56.本领域普通技术人员可以理解实现上述实施例方法中的全部或部分流程，是可以通过计算机程序来指令相关的硬件来完成，所述的程序可存储于一非易失性计算机可读取存储介质中，该程序在执行时，可包括如上述各方法的实施例的流程。其中，本技术所提供的各实施例中所使用的对存储器、存储、数据库或其它介质的任何引用，均可包括非易失性和/或易失性存储器。非易失性存储器可包括只读存储器(rom)、可编程rom(prom)、电可编程rom(eprom)、电可擦除可编程rom(eeprom)或闪存。易失性存储器可包括随机存取存储器(ram)或者外部高速缓冲存储器。作为说明而非局限，ram以多种形式可得，诸如静态ram(sram)、动态ram(dram)、同步dram(sdram)、双数据率sdram(ddrsdram)、增强型sdram(esdram)、同步链路(synchlink)dram(sldram)、存储器总线(rambus)直接ram(rdram)、直接存储器总线动态ram(drdram)、以及存储器总线动态ram(rdram)等。
57.以上实施例的各技术特征可以进行任意的组合，为使描述简洁，未对上述实施例中的各个技术特征所有可能的组合都进行描述，然而，只要这些技术特征的组合不存在矛盾，都应当认为是本说明书记载的范围。
58.以上所述实施例仅表达了本技术的几种实施方式，其描述较为具体和详细，但并不能因此而理解为对本技术专利范围的限制。应当指出的是，对于本领域的普通技术人员来说，在不脱离本技术构思的前提下，还可以做出若干变形和改进，这些都属于本技术的保护范围。因此，本技术专利的保护范围应以所附权利要求为准。

技术特征：
1.一种用户界面框架适配渲染方法，其特征在于，包括如下步骤：获取第一用户界面代码，所述第一用户界面代码中包括有第一框架信息，所述第一框架信息用于表征开发端开发用户界面所使用的用户界面框架；获取用户界面渲染器的第二框架信息，所述第二框架信息用于表征用户端用户界面渲染器渲染用户界面所使用的用户界面框架；当所述第一框架信息和所述第二框架信息不匹配时，对所述第一用户界面代码执行动态匹配操作以将所述第一用户界面代码处理为第二用户界面代码，所述第二用户界面代码的框架信息与第二框架信息匹配；将所述第二用户界面代码发送至用户端，以使所述用户界面渲染器对所述第二用户界面代码进行处理，以完成用户界面的渲染生成。2.如权利要求1所述的用户界面框架适配渲染方法，其特征在于，所述第一框架信息和所述第二框架信息不匹配，包括：所述第一框架信息和所述第二框架信息表征二者框架类型不同；或，当所述第一框架信息和所述第二框架信息表征二者框架类型相同时，获取所述第一框架信息的第一版本信息和所述第二框架信息的第二版本信息，所述第一版本信息和所述第二版本信息不兼容。3.如权利要求2所述的用户界面框架适配渲染方法，其特征在于，当所述第一版本信息和所述第二版本信息不兼容时，所述对所述第一用户界面代码执行动态匹配操作以将所述第一用户界面代码处理为第二用户界面代码，包括：根据所述第一版本信息和所述第二版本信息获取更新补丁；通过对所述第一用户界面代码安装所述更新补丁，以得到所述第二用户界面代码。4.如权利要求1所述的用户界面框架适配渲染方法，其特征在于，所述对所述第一用户界面代码执行动态匹配操作以将所述第一用户界面代码处理为第二用户界面代码，包括：将所述第一用户界面代码和所述第二框架信息注入预先构建的框架匹配模型；所述框架匹配模型根据所述第一框架信息和所述第二框架信息确定匹配关系；根据所述匹配关系处理所述第一用户界面代码以得到所述第二用户界面代码。5.如权利要求4所述的用户界面框架适配渲染方法，其特征在于，所述框架匹配模型包括标签匹配器、方法匹配器和样式匹配器；所述根据所述匹配关系处理所述第一用户界面代码以得到所述第二用户界面代码，包括：所述标签匹配器提取出所述第一用户界面代码中的第一标签，并将所述第一标签转化为第二标签，所述第二标签为通用格式的标签形式；根据所述匹配关系处理所述第二标签以得到第三标签，所述第三标签为所述用户界面渲染器能够处理的形式；所述方法匹配器提取出所述第一用户界面代码中的第一方法，并将所述第一方法转化为第二方法，所述第二方法为通用格式的方法形式；根据所述匹配关系处理所述第二方法以得到第三方法，所述第三方法为所述用户界面渲染器能够处理的形式；所述样式匹配器提取出所述第一用户界面代码中的第一样式，根据所述匹配关系处理所述第一方法以得到第二样式，所述第二样式为所述用户端适用的界面形式；
汇总所述第三标签、所述第三方法和所述第二样式，以得到所述第二用户界面代码。6.如权利要求4所述的用户界面框架适配渲染方法，其特征在于，所述根据所述匹配关系处理所述第一用户界面代码以得到所述第二用户界面代码，包括：根据匹配关系获取配置参数；利用所述配置参数对所述第一用户界面代码进行设置，以得到所述第二用户界面代码。7.如权利要求1所述的用户界面框架适配渲染方法，其特征在于，所述用户界面渲染器对所述第二用户界面代码进行处理，包括：所述用户界面渲染器获取执行动态匹配操作中生成的匹配参数信息，并根据所述第二框架信息确定所述用户界面渲染器渲染用户界面需采用的渲染引擎；所述渲染引擎根据所述匹配参数信息对所述第二用户界面代码进行解析以完成用户界面的渲染生成。8.一种用户界面框架适配渲染装置，其特征在于，包括：获取模块，用于获取第一用户界面代码，所述第一用户界面代码中包括有第一框架信息，所述第一框架信息用于表征开发端开发用户界面所使用的用户界面框架；获取用户界面渲染器的第二框架信息，所述第二框架信息用于表征用户端用户界面渲染器渲染用户界面所使用的用户界面框架；适配模块，用于当所述第一框架信息和所述第二框架信息不匹配时，对所述第一用户界面代码执行动态匹配操作以将所述第一用户界面代码处理为第二用户界面代码，所述第二用户界面代码的框架信息与第二框架信息匹配；渲染模块，用于将所述第二用户界面代码发送至用户端，以使所述用户界面渲染器对所述第二用户界面代码进行处理，以完成用户界面的渲染生成。9.一种计算机设备，其特征在于，包括处理器和存储器；所述处理器用于执行所述存储器中存储的计算机程序以实现如权利要求1到7中任一项所述方法。10.一种计算机可读存储介质，其特征在于，所述计算机可读存储介质存储有计算机程序，所述计算机程序被处理器执行时实现如权利要求1到7中任一项所述方法。

技术总结
本申请实施例公开了一种用户界面框架适配渲染方法、用户界面框架适配渲染装置、计算机设备和计算机可读存储介质。其中，方法包括在第一框架信息和第二框架信息不匹配时，通过执行动态匹配操作将第一用户界面代码处理为第二用户界面代码。之后将第二用户界面代码发送至用户端，以使用户界面渲染器对第二用户界面代码进行处理，以完成用户界面的渲染生成。因此，本申请能够通过动态匹配操作将不兼容的第一用户界面代码转化为能够被用户端用户界面渲染器渲染使用的第二用户界面代码，以实现了框架统一，使得用户界面框架切换将更加简单便捷，大大提高了生产效率，降低人力投入成本。降低人力投入成本。降低人力投入成本。


技术研发人员：黄勇
受保护的技术使用者：平安银行股份有限公司
技术研发日：2023.07.03
技术公布日：2023/10/8