VUE页面生成方法及装置制造方法及图纸

技术编号:36045497 阅读:28 留言:0更新日期:2022-12-21 10:53
本发明专利技术提供了一种VUE页面生成方法及装置,应用于服务器,服务器中存储有模板库和VUE组件库,模板库中包括多种页面模板,每种页面模板通过VUE组件库中的多种VUE组件拖拽生成;包括:根据页面配置需求,从模板库中提取页面配置需求对应的页面模板;基于页面配置需求,针对页面模板中的VUE组件进行拖拽调整,以对页面修改;将页面修改的结果确定为页面配置需求对应的目标VUE页面。所使用的VUE组件可以直接生成相应的代码,页面开发人员无需专业学习前端VUE知识,仅按照页面配置需求对应的UI展示对VUE组件可视化拖拽,就能快速生成VUE页面及代码,提高用户体验,降低开发的学习成本,缩短开发周期。短开发周期。短开发周期。

【技术实现步骤摘要】
VUE页面生成方法及装置


[0001]本专利技术涉及页面处理
,尤其涉及一种VUE页面生成方法及装置。

技术介绍

[0002]随着技术的逐渐发展,前后端分离、前端框架的更新迭代,为了提供更好用户体验越来越多系统将前端页面由传统的JSP、HTML向angular和vue和react转换。传统jsp系统模式下,前端人员仅需将静态页面做出即可,页面动态数据渲染、调接口、业务逻辑编写后台开发人员均可完成,但随着前台技术的迭代,学习成本逐渐增加,部分开发团队中的后台开发人员已经不能再兼职开发前端页面,后端开发同事无法独自完成静态页面的动态渲染。同一个前端同事需负责多个需求,导致出现任务阻塞等问题,越来越多的团队需招聘大量的前端专职开发人员也造成了团队人员成本的增加。
[0003]近年来,低代码/无代码开发热潮又一次袭来,业界对“降本、增效、提质”的声音越来越强。低代码开发模式通常为组件化配置,如VUE为组件化配置之一,但组件化配置技术较为新颖,现有技术针对VUE组件的兼容性较差,对VUE支持不足,产品仅能生成html代码,无法转换为VUE代本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种VUE页面生成方法,其特征在于,所述方法应用于服务器,所述服务器中存储有模板库和VUE组件库,所述VUE组件库包括拖拽组件,以及与拖拽组件封装的多种VUE组件,所述模板库中包括多种页面模板,每种所述页面模板通过所述VUE组件库中的多种VUE组件拖拽生成;所述方法包括:获取预设的页面配置需求;根据所述页面配置需求,从所述模板库中提取所述页面配置需求对应的页面模板;基于所述页面配置需求,针对所述页面模板中的VUE组件进行拖拽调整,以对页面修改;将所述页面修改的结果确定为所述页面配置需求对应的目标VUE页面。2.根据权利要求1所述的方法,其特征在于,所述页面配置需求包括VUE组件需求和页面布局需求;所述基于所述页面配置需求,针对所述页面模板中的VUE组件进行拖拽调整,以对页面修改的步骤,包括:针对所述页面配置需求中的VUE组件需求和所述页面模板中的VUE组件,从所述VUE组件库中获取目标VUE组件;其中,所述目标VUE组件包括未在所述页面模板中展示的VUE组件;将所述目标VUE组件载入所述页面模板中,并根据所述页面布局需求,拖拽所述目标VUE组件的位置,以对所述页面模板的页面布局进行调整。3.根据权利要求2所述的方法,其特征在于,所述页面布局需求包括预设的适配比例;所述根据所述页面布局需求,拖拽所述目标VUE组件的位置,以对所述页面模板的页面布局进行调整的步骤之后,所述方法还包括:预览调整后的页面布局,判断所述页面布局是否满足所述页面布局需求中的适配比例;如果是,将所述页面布局确定为目标VUE页面对应的页面布局。4.根据权利要求1所述的方法,其特征在于,所述页面模板中包括页面关键字和页面展示结果,所述页面展示结果与所述页面模板的VUE组件对应;所述根据所述页面配置需求,从所述模板库中提取所述页面配置需求对应的页面模板的步骤,包括:获取所述页面模板的页面关键字和页面展示结果;判断所述页面关键字是否满足所述页面配置需求对应的关键字,且,所述页面展示结果中的VUE组件是否满足所述页面配置需求对应的VUE组件需求;如果是,将当前页面模板确定为所述页面配置需求对应的页面模板...

【专利技术属性】
技术研发人员:李祥南付超文静刘源吴孟华刘美岐
申请(专利权)人:阳光人寿保险股份有限公司
类型:发明
国别省市:

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1