el-form点击提交后把验证失败的数据传给了后端

news2025/1/11 10:12:09

问题:版本号需要根据后端返回的结果查看是否可用,在这里1.0.0是不可用的,如果点击其他地方则会报红,可是直接点击提交,则会把1.0.0这个错误的数据也提交给后端。
在这里插入图片描述
在这里插入图片描述
解决方案:
html代码:

<el-form :model="formdata" ref="formdata" label-width="80px" status-icon :rules="rules">
	<el-form-item class="formitem" label="版本号" prop="versionNumber">
	  	<el-input v-model="formdata.versionNumber"></el-input>
	</el-form-item>
<el-form>

js代码:

data () {
	 var validateNum=async(rule,value,callback)=>{
	   if (value === '') {
	     callback(new Error('请输入版本号'));
	   } else {
	     var val=await this.onBlur();
	     if(val){
	       callback();
	     }else{
	       this.formdata.versionNumber='';
	       callback(new Error('版本号不可用'));
	     }
	   }
	 }
	 return {
	   fileList:[],
	   formdata:{
	     versionNumber:'',
	     versionType: null,
	     file:''
	   },
	   rules:{
	     versionNumber:[
	       {validator:validateNum,trigger:'blur'}
	     ],
	   },
	   newFile:{},
	   submitFile:{}
	 }
}

在提交按钮绑定的点击事件中使用validate去查看验证是否正确,正确则进行传输。

submitForm(){
  this.$refs.formdata.validate(valid=>{
    if(valid){
      this.submitFile.versionNumber=this.formdata.versionNumber;
      this.$axios({
        url: `/proxy_version/renew/versionUpload`,
        method: 'post',
        data:this.submitFile,
        success: (result) => {
          console.log(result);
          // this.$message.success("操作成功!");
        }
      });
      console.log(this.submitFile);
    }
  })
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1361939.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

算法第十二天-最大整除子集

最大整除子集 题目要求 解题思路 来自[宫水三叶] 根据题意&#xff1a;对于符合要求的[整除子集]中的任意两个值&#xff0c;必然满足[较大数]是[较小数]的倍数 数据范围是 1 0 3 10^3 103&#xff0c;我们不可能采取获取所有子集&#xff0c;再检查子集是否合法的暴力搜解法…

C++ 给父类带参构造函数的赋值

在类的使用中&#xff0c;默认的构造函数不带任何参数&#xff0c;但是也会因为需要而使用带参数的构造函数。 在带参的构造函数中&#xff0c;是如何继承的呢&#xff0c;这里我们通过使用基类&#xff0c;子类&#xff0c;孙类的两重继承来观察&#xff0c;如何给带参构造函数…

C++: 求1+2+3+...+n

int i 1; int sum 0; class Sum { public:Sum(){sum i;i;} };class Solution { public:int Sum_Solution(int n) {Sum a[n]; //调用n次sum的构造函数return sum;} };

2024年汉字小达人区级选拔备考——真题做一做:诗词连线

前面&#xff0c;六分成长介绍了汉字小达人区级选拔样题的第一大题看拼音写汉字&#xff0c;以及第二大题补充成语。这两道题都是填空题&#xff0c;通常在学校进行线下选拔的时候使用。这篇文章介绍第三大题&#xff1a;诗词连线。 诗词连线是2022年&#xff08;第九届&#x…

计算机毕业设计 SpringBoot的一站式家装服务管理系统 Javaweb项目 Java实战项目 前后端分离 文档报告 代码讲解 安装调试

&#x1f34a;作者&#xff1a;计算机编程-吉哥 &#x1f34a;简介&#xff1a;专业从事JavaWeb程序开发&#xff0c;微信小程序开发&#xff0c;定制化项目、 源码、代码讲解、文档撰写、ppt制作。做自己喜欢的事&#xff0c;生活就是快乐的。 &#x1f34a;心愿&#xff1a;点…

【Kubernetes】认证授权RBAC (一)

认证授权RBAC 一、k8s安全管理&#xff1a;认证、授权、准入控制概述1.1、简介【1】认证基本介绍【2】授权基本介绍【3】准入控制基本介绍 1.2、认证【1】客户端认证【2】Bearertoken【3】Serviceaccount【4】拓展&#xff1a;kubeconfig文件 1.3、授权【1】什么是RBAC&#xf…

8、VS中Git使用

VS中Git使用 1.基础操作1.1 VS配置Git1.2 操作界面 2.本地库版本管理2.1 创建管理本地库2.2 暂存、存储2.3 提交2.4 版本切换 3.分支操作3.1 分支应用3.2 新建分支3.3 合并分支、解决冲突3.4 删除分支 4.远程库版本管理4.1 新建、克隆4.2 提取、拉取、推送与同步4.3 团队开发 最…

每日一题——LeetCode1051.高度检查器

方法一 sort排序&#xff1a; 创建一个元素和heights一模一样的expect数组 &#xff0c;将expect数组从小到大进行排序&#xff0c;比较heights和expect相同位置不同的元素个数 var heightChecker function(heights) {var expect [],count0for(const n of heights){expect.…

Ubuntu 安装Nginx服务

文章目录 前言一、Nginx安装1. Nginx默认安装2. Nginx指定版本安装3. Nginx验证4. Nginx服务控制4.1 查看服务状态4.2 停止服务4.3 启动服务4.4 重启服务 5. Nginx文件存放目录 二、自己编译Nginx1. 下载源码2. 依赖配置3. 编译 三、Nginx卸载总结 前言 Nginx&#xff08;发音为…

时序分解 | Matlab实现CPO-VMD基于冠豪猪优化算法(CPO)优化VMD变分模态分解时间序列信号分解

时序分解 | Matlab实现CPO-VMD基于冠豪猪优化算法(CPO)优化VMD变分模态分解时间序列信号分解 目录 时序分解 | Matlab实现CPO-VMD基于冠豪猪优化算法(CPO)优化VMD变分模态分解时间序列信号分解效果一览基本介绍程序设计参考资料 效果一览 基本介绍 【原创】CPO-VMD【24年新算法…

LeetCode做题总结 15. 三数之和、18. 四数之和 (Java)

不会做&#xff0c;参考了代码随想录和力扣官方题解&#xff0c;对此题进行整理。 X数之和 15. 三数之和代码思路20240103重写错误1错误2Java语言点总结 18. 四数之和代码思路20240104&#xff08;伪&#xff09;错误1 第一次剪枝错误2 第二次剪枝错误3 溢出 15. 三数之和 代码…

python中parsel模块的css解析

一、爬虫页面分类 1.想要爬取的内容全部在标签中&#xff0c;可以使用xpath去进行解析如下图 2.想要爬取的内容呈现json的数据特征&#xff0c;用.json()转换为字典格式 3.页面不规则&#xff0c;标签中包含大括号&#xff0c;如下面想要获取键值内容怎么做&#xff0c;先用re正…

Hive学习(13)lag和lead函数取偏移量

hive里面lag函数 在数据处理和分析中&#xff0c;窗口函数是一种重要的技术&#xff0c;用于在数据集中执行聚合和分析操作。Hive作为一种大数据处理框架&#xff0c;也提供了窗口函数的支持。在Hive中&#xff0c;Lag函数是一种常用的窗口函数&#xff0c;可以用于计算前一行…

R 批量对多个变量进行单因素方差分析 批量计算均值±标准差

多个变量批量进行单因素方差 R实现 文章目录 一、批量生成均值标准差 P值二、添加协变量单因素方差分析&#xff0c;生成校正P值三、在分层情况下进行单因素方差分析四、添加协变量和交互项的单因素方差分析&#xff0c;生成交互项的P值 一、批量生成均值标准差 P值 数据结构如…

设计模式之单例模式的懒饿汉

懒汉式 说白了就是你不叫我我不动&#xff0c;你叫我我才动。 类初始化模式&#xff0c;也叫延迟占位模式。在单例类的内部由一个私有静态内部类来持有这个单例类的实例。因为在 JVM 中&#xff0c;对类的加载和类初始化&#xff0c;由虚拟机保证线程安全。 public class Singl…

【Proteus仿真】【Arduino单片机】水箱液位监控系统

文章目录 一、功能简介二、软件设计三、实验现象联系作者 一、功能简介 本项目使用Proteus8仿真Arduino单片机控制器&#xff0c;使用LCD1602液晶、按键、蜂鸣器、液位传感器、ADC转换器、水泵等。 主要功能&#xff1a; 系统运行后&#xff0c;LCD1602显示当前水位、上下限阈…

支持 input 函数的在线 python 运行环境 - 基于队列

支持 input 函数的在线 python 运行环境 - 基于队列 思路两次用户输入三次用户输入 实现前端使用 vue element uiWindows 环境的执行器子进程需要执行的代码 代码仓库参考 本文提供了一种方式来实现支持 input 函数&#xff0c;即支持用户输的在线 python 运行环境。效果如下图…

[NAND Flash 5.2] SLC、MLC、TLC、QLC、PLC NAND_闪存颗粒类型

依公知及经验整理&#xff0c;原创保护&#xff0c;禁止转载。 专栏 《深入理解NAND Flash》 <<<< 返回总目录 <<<< 前言 闪存最小物理单位是 Cell, 一个Cell 是一个晶体管。 闪存是通过晶体管储存电子来表示信息的。在晶体管上加入了浮动栅贮存电子…

网络调试 TCP,开发板用静态地址-入门7

用两台电脑&#xff08;无线网络&#xff09;做实验 1.1, 在电脑A上设置为Server如下&#xff1a; 选择TCP Server后&#xff0c;直接跳出用本机IP做为“本地主机地址” 1.2在 电脑B上设置为Client, 远程主机地址设置为Server的 IP 1.3, 在A, B两台电脑上能够互相发送数据 用…

Pyinstaller 打包的文件过大,根本原因在于包含了无用的依赖文件

环境要求&#xff1a;Windows&#xff0c;Pyinstaller 6.3.0 (不是这个版本的话&#xff0c;请逐步校对以下我在运行过程中的截图) 本文所使用代码不开源&#xff0c;觉得本文的思路可行的话&#xff0c;请加 QQ - 1398173074 购买 (&#xffe5;30&#xff0c;注明来意)&…