[发明专利]基于Vue的表单配置方法、系统、计算机设备及存储介质在审
| 申请号: | 202011337485.5 | 申请日: | 2020-11-25 |
| 公开(公告)号: | CN112464070A | 公开(公告)日: | 2021-03-09 |
| 发明(设计)人: | 阮超;王小普 | 申请(专利权)人: | 银盛通信有限公司 |
| 主分类号: | G06F16/953 | 分类号: | G06F16/953;G06F16/957;G06F16/2455;G06F16/245;H04L29/08 |
| 代理公司: | 深圳市深可信专利代理有限公司 44599 | 代理人: | 万永泉 |
| 地址: | 518000 广东省深圳市龙华*** | 国省代码: | 广东;44 |
| 权利要求书: | 查看更多 | 说明书: | 查看更多 |
| 摘要: | |||
| 搜索关键词: | 基于 vue 表单 配置 方法 系统 计算机 设备 存储 介质 | ||
1.一种基于Vue的表单配置方法,其特征在于,该方法包括以下的步骤:
S1、进入前端页面渲染前端页面的基础结构,包括查询表单配置信息的步骤、后端服务器判断处理当前用户可查看显示的表单参数的步骤,以及返回给前端页面进行处理的步骤;
S2、前端页面处理后端服务器返回的表单参数,包括前端Vue获取表单配置信息的步骤、根据定义的规则解码参数的步骤以及形成表单的基本结构显示在前端页面上的步骤;
S3、前端页面提交表单。
2.根据权利要求1所述的基于Vue的表单配置方法,其特征在于,所述的步骤S1中,查询表单配置信息的步骤包括:
通过进入前端页面,向Web服务器传递当前的前端页面ID和请求参数,Web服务器通过查询数据库的配置信息,获取当前前端页面的配置信息。
3.根据权利要求2所述的基于Vue的表单配置方法,其特征在于,所述的数据库为Mysql数据库或DB数据库。
4.根据权利要求2所述的基于Vue的表单配置方法,其特征在于,所述的步骤S1中,后端服务器判断处理当前用户可查看显示的表单参数的步骤包括:
Web服务器的规则查询模块,经过对配置信息的处理,返回前端页面的基础结构,包括表单的查询条件以及查询条件的选择项。
5.根据权利要求4所述的基于Vue的表单配置方法,其特征在于,所述的步骤S1中,返回给前端页面进行处理的步骤包括:
Web服务器的规则查询模块处理完成后,返回到前端页面。
6.根据权利要求1所述的基于Vue的表单配置方法,其特征在于,所述的步骤S2中,前端Vue获取表单配置信息的步骤包括:
表单配置信息包括list和url,list中包含多个json对象,每个json对象含有type和config,其中type分为Input、textarea、radio、select和checkbox的form表单规范的类型或者自定义命名的类型;config对应当前类型的属性配置,包括默认值default_value、输入框提示文本placeholder以及错误提示error_msg。
7.根据权利要求6所述的基于Vue的表单配置方法,其特征在于,所述的步骤S2中,根据定义的规则解码参数的步骤包括:
前端Vue包括有Vue解析模块,Vue解析模块获取到配置的list对象后,进行循环遍历解析,针对每一次遍历,获取type,根据对应的type显示对应的表单元素;如是自定义的表单元素,则渲染规定的对应的组件元素;
对表单元素进行渲染后,获取对应的config,根据config的配置赋予对应的属性。
8.根据权利要求7所述的基于Vue的表单配置方法,其特征在于,当type为input类型,则赋予value和placeholder属性;当type为date类型,则赋予时间范围的属性。
9.根据权利要求1所述的基于Vue的表单配置方法,其特征在于,所述的步骤S2中,形成表单的基本结构显示在前端页面上的步骤中:
表单的基本结构在前端页面显示后,根据配置进行表单的交互,交互内容包括显示默认值和显示错误提示。
10.一种基于Vue的表单的配置系统,其特征在于,包括前端页面、Web服务器、后端服务器以及数据库;
所述的前端页面,用于向Web服务器发起请求,Web服务器通过查询数据库的配置信息,获取当前前端页面的配置参数;
所述的Web服务器,包括规则查询模块,经过对配置信息的处理,返回前端页面的基础结构;
所述的后端服务器,与Web服务器相连接,用于判断处理当前用户可查看显示的表单参数,并返回给前端页面进行处理。
11.根据权利要求10所述的一种基于Vue的表单的配置系统,其特征在于,所述的数据库为Mysql数据库或DB数据库。
该专利技术资料仅供研究查看技术是否侵权等信息,商用须获得专利权人授权。该专利全部权利属于银盛通信有限公司,未经银盛通信有限公司许可,擅自商用是侵权行为。如果您想购买此专利、获得商业授权和技术合作,请联系【客服】
本文链接:http://www.vipzhuanli.com/pat/books/202011337485.5/1.html,转载请声明来源钻瓜专利网。
- 上一篇:编译方法、装置、电子设备和存储介质
- 下一篇:绿篱修剪刀盘及绿篱修剪作业车





