前端代码生成方法及装置制造方法及图纸

本申请实施例提供一种前端代码生成方法及装置，可用于金融技术领域，方法包括若检测到用户在当前的图形化显示页面中添加预设的目标参数化组件，则自动更新对应的配置文件并输出更新后的配置文件对应的第一预览页面，以在用户自第一预览页面中对目标参数化组件进行编辑后，再次自动更新配置文件；将当前最新更新后的配置文件转译为原生代码；输出原生代码对应的第二预览页面，以在用户自该第二预览页面中对原生代码进行编辑后，得到对应的目标前端代码。本申请能够在满足用户的个性化编辑要求的基础上，有效降低前端代码生成过程中对开发人员的专业度要求、工作量及时间成本，并能够有效提高前端代码生成的灵活程度、智能化程度和自动化程度。

【技术实现步骤摘要】
前端代码生成方法及装置
本申请涉及数据处理
，特别涉及金融
，具体涉及前端代码生成方法及装置。
技术介绍
在目前的前端开发过程中，在页面布局投入的工作量有一半左右，虽然目前已有一些可配置生成页面的工具，但思路是用特定参数化组件对配置信息进行解析，导致使用范围常见于表单之类的场景。由于这类工具的解析工作是由引入的特定参数化组件完成，因此该参数化组件本身的解析能力往往会成为场景适用性的瓶颈，同时增加了开发人员的专业度要求、工作量及时间成本；且若仅将解析得到的代码作为最终的前端代码，虽然满足了自动开发的要求，但却无法满足开发人员对前端代码的个性化定制要求。也就是说，现有的前端代码生成方式无法同时满足用户的个性化编辑要求并符合开发人员传统开发习惯。
技术实现思路
针对现有技术中的问题，本申请提供一种前端代码生成方法及装置，能够在满足用户的个性化编辑要求的基础上，有效降低前端代码生成过程中对开发人员的专业度要求、工作量及时间成本，并能够有效提高前端代码生成的灵活程度、智能化程度和自动化程度。为解决上述技术问题，本申本文档来自技高网...

【技术保护点】
1.一种前端代码生成方法，其特征在于，包括：/n若检测到用户在当前的图形化显示页面中添加预设的目标参数化组件，则自动更新对应的配置文件并输出更新后的配置文件对应的第一预览页面，以在用户自该第一预览页面中对所述目标参数化组件进行编辑后，再次自动更新所述配置文件；/n将当前最新更新后的配置文件转译为对应的原生代码；/n输出所述原生代码对应的第二预览页面，以在用户自该第二预览页面中对所述原生代码进行编辑后，得到对应的目标前端代码。/n

【技术特征摘要】
1.一种前端代码生成方法，其特征在于，包括：
若检测到用户在当前的图形化显示页面中添加预设的目标参数化组件，则自动更新对应的配置文件并输出更新后的配置文件对应的第一预览页面，以在用户自该第一预览页面中对所述目标参数化组件进行编辑后，再次自动更新所述配置文件；
将当前最新更新后的配置文件转译为对应的原生代码；
输出所述原生代码对应的第二预览页面，以在用户自该第二预览页面中对所述原生代码进行编辑后，得到对应的目标前端代码。


2.根据权利要求1所述的前端代码生成方法，其特征在于，所述将当前最新更新后的配置文件转译为对应的原生代码，包括：
布局识别步骤：获取当前最新更新后的配置文件对应的布局容器及对应的布局代码；
获取各个所述布局容器内参数化组件对应的目标组件代码，其中，所述目标组件代码中包含有参数化组件属性；
检测已获取组件代码的各个所述参数化组件中是否包含有其他参数化组件，若是，则返回执行所述布局识别步骤，直至获取全部参数化组件对应的目标组件代码；
根据所述布局代码和目标组件代码生成对应的原生代码。


3.根据权利要求2所述的前端代码生成方法，其特征在于，所述获取当前最新更新后的配置文件对应的布局容器及对应的布局代码，包括：
以预设的深度优先方式遍历当前最新更新后的配置文件，并对该配置文件进行布局识别，以得到当前最新更新后的配置文件对应的布局容器；
根据当前最新更新后的配置文件对应的布局容器生成对应的布局代码。


4.根据权利要求2所述的前端代码生成方法，其特征在于，所述获取各个所述布局容器内参数化组件对应的目标组件代码，包括：
对各个所述布局容器分别进行参数化组件识别，以得到当前最新更新后的配置文件对应的参数化组件，并对各个所述布局容器分别进行参数化组件属性识别，以得到当前最新更新后的配置文件对应的各个参数化组件的参数化组件属性；
根据各个所...

【专利技术属性】
技术研发人员：刘泱，郑凯，杨再同，詹娇淑，
申请(专利权)人：中国工商银行股份有限公司，
类型：发明
国别省市：北京;11