验证必须是数字php,Element 中表单非必填数据项 必须为数字的验证问题

Element-ui 的el-form组建中,自带基本的验证功能,比如某些项必填的验证,直接加入rules 规则中即可,如下实例:

在页面中书写如下:

在vue 初始化data中

filterForm: {

firstDay: '',

lastDay: ''

},

rules: {

firstDay: [{ type: 'string', required: true, message: '请选择日期范围', trigger: 'submit' }],

lastDay: [{ type: 'string', required: true, message: '请选择日期范围', trigger: 'submit' }],

}

这样就会对日期进行必填验证。

但是现在遇到一个这样的问题,表单中有一个数据,比如是数字,但是又非必填项,这时候直接使用上面的方式进行验证,就会出现问题。

比如,如果没有填写数字,提交表单的时候就会提示设定的警告信息,这不是我们想要的,因为是非必填项,所以当用户不填写的时候,应该也可以直接提交,填写的时候,验证必须是数字即可。

9eace9501bfc19ad0948bf0407bc303d.png

解决方案:在rules 中验证这个功能的时候,对填写的数值进行判断

rules: {

averageCaseRunTime: [{

type: 'number',

trigger: 'blur',

required: false,

message: '平均用例运行时长必须为数字值',

transform (value) {

return _.toNumber(value)

}

}]

}

这样在提交的时候,就不会因为用户没有输入任何数值,提示警告信息了。

Vue Elementui 表单必填项和非必填项label文字对齐的简单方式

1. 不好的方式 很长时间以来都是用改写form-item样式来使得必填项和非必填项保证label对齐,这样需要改写系统样式,还要在相应的item上引用,代码量增多,示例如下(不推荐)

SpringMVC 上传文件(文件非必填)MultipartHttpServletRequest

原文:https://blog.csdn.net/dorothy1224/article/details/79136676 上传文件(文件非必填)MultipartHttpServletRequest ...

将ECSHOP会员注册页面的Email修改成非必填项

将ECSHOP会员注册页面的Email修改成非必填项 ECSHOP教程/ ecshop教程网(www.ecshop119.com) 2011-07-29   有人说,在后台的 “会员注册项设置 ”里面 ...

discuz X3.2邮箱非必填

最近有个需求是:邮箱非必答,但是X3.2是邮箱必填: 找到资料:http://www.51php.com/discuz/17147.html 但是修改后不起作用!提示‘Email 地址无效’! 用fi ...

织梦dedecms自定义表单设置必填项

1. 用php验证 在plus/diy.php的第 40行下加 //增加必填字段判断 if($required!=''){ if(preg_match('/,/', $required)) { $re ...

lay-verify进行非必填项校验

它默认都验证了! 需要调整源码!form.js,layui.all.js this.config = { verify: { required: [/[\S]+/, "必填项不能为空&quo ...

AngularJS 表单验证手机号(非必填)

代码:

v-show和element中表单验证validate起到的化学反应

说起v-show和v-if,进行前端开发的大家一定不会陌生,他们都是用来控制标签元素的显示与隐藏的,他们的区别就是v-show会把标签渲染出来,只是会隐藏起来,相当于visibility:hidden ...

element 中表单验证的解析。

https://blog.csdn.net/qq_24504591/article/details/88048894 https://segmentfault.com/a/11900000125513 ...

随机推荐

struts学习

1.集成tomcat到eclipse http://www.eclipsetotale.com/tomcatPlugin.html 下载最新的plug后,解压.解压后的文件放到eclipse的plug ...

jQuery animate easing使用方法

从jQuery API 文档中可以知道,jQuery自定义动画的函数.animate( properties [, duration] [, easing] [, complete] )有四个参数: ...

Hadoop学问Eclipse构建Hadoop工程

在此之前的基础Hadoop在官方文件HDFS.MapReduce架构.配置管理是学习,但是,一些地方的官方文件相当含糊的解释. 我们没有发挥人可以体验,某种官方文件似业务规则或要求,但是,真正的细节还 ...

【最长下降子序列的长度和个数】 poj 1952

转自http://blog.csdn.net/zhang360896270/article/details/6701589 这题要求最长下降子序列的长度和个数,我们可以增加数组maxlen[size] ...

python编程实战

1.计算对称平方数 题目描述 打印所有不超过n(n<256)的,其平方具有对称性质的数,如11*11=121. 输入描述 无 输出描述 每行一个数,表示对称平方数 def f(n): flag ...

Nuxt&period;js部署应用的方式

Nuxt.js 提供了两种发布部署应用的方式:服务端渲染应用部署 和 静态应用部署. 静态应用部署就不说了,主要说说服务端渲染应用部署. 官方部署方式 关于服务端渲染应用部署,官方文档是这么写的: 部 ...

php在cli模式下取得命令行中的参数的方法-getopt命令行可传递数组-简单自定义方法取命令行参数

在cli模式下执行PHP时,自动给脚本文件传递了一个变量$argv,其值即是一个命令中所有值组成的数组(以空格区分),在PHP程序中接收参数有3种方法1.直接使用argv变量数组. 2.使用$_SER ...

Spring生态研习【一】:定时任务Spring-task

本系列具体研究一下spring生态中的重要或者常用的功能套件,今天从定时任务开始,主要是spring-task.至于quartz,下次找个时间再总结. 我的验证环境,是SpringCloud体系下,基 ...

Unity3D Update&lpar;&rpar; 和 FixedUpdate&lpar;&rpar;区别

Unity3D中 Update()与FixedUpdate()的区别是什么呢?从字面上理解,它们都是在更新时会被调用,并且会循环的调用.但是Update会在每次渲 染新的一帧时,被调用.而FixedU ...

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

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

相关文章

为开发者准备的9个实用PHP代码片段(转)

[导读] 当你开发网站、app或博客系统时&#xff0c;如果有一些实用的代码片段可以直接使用&#xff0c;就可以节省你大量的时间和精力。这篇文章就为你分享几个实用的PHP代码片段&#xff0c;帮助你的Web开发。 本文由PHP100中文网编译&#xff0c;转载请看文末的转载要求&…

idea 自动生产序列吗,IDEA自动生成序列化Id

实体对象实现了java.io.Serializable接口后&#xff0c;一般都会提供一个serialVersionUID以做版本区分。在idea里&#xff0c;可以通过设置来快速生成serialVersionUID。设置方法1、打开Preferences–>Editor–>Inspections&#xff0c;然后在右侧输入UID进行搜索(搜索方…

ZH奶酪:Ionic中(弹出式窗口)的$ionicModal使用方法

Ionic中[弹出式窗口]有两种&#xff08;如下图所示&#xff09;&#xff0c;$ionicModal和$ionicPopup; $ionicModal是完整的页面&#xff1b; $ionicPopup是(Dialog)对话框样式的&#xff0c;直接用JavaScript设定对话框的一些参数&#xff0c;通常用于通知消息、确认等作用&a…

php实现购物车 redis,redis 哈希数据类型简单操作(实现购物车案例)

这里不累赘如何安装redis和php redis扩展&#xff0c;主要熟悉调用redis哈希数据类型如图简单方法操作如下1&#xff1a;hSet2:hGet4:hDel5:hGetAll4:hExists5:hIncrBy简单购物车实现namespaceHome\Controller;useThink\Controller;useOrg\Net\Http;useThink\Cache\Driver\Red…

php scsi平台,三大SCSI Target平台PK:让服务器化身SAN

就服务器而言&#xff0c;从虚拟化平台到数据库应用的许多功能&#xff0c;都需要有SAN存储设备的支持&#xff0c;但是对于模拟测试、教学之类的应用来说&#xff0c;受到成本限制采购SAN存储设备便有所困难。特别是企业&#xff0c;都不会仅仅为了测试等常态使用的用途&#…

[BZOJ 1012] [JSOI 2008] 最大数maxnumber

1012: [JSOI2008]最大数maxnumber Time Limit: 3 Sec Memory Limit: 162 MBSubmit: 5094 Solved: 2276[Submit][Status][Discuss]Description 现在请求你维护一个数列&#xff0c;要求提供以下两种操作&#xff1a; 1、 查询操作。语法&#xff1a;Q L 功能&#xff1a;查询当…

php 数组元素往后移动,php 二维数组 元素移动

[已关闭问题]关闭于 2014-11-20 16:02二维数组元素如何实现&#xff0c;满足一定的条件&#xff0c;跳到下下个元素&#xff0c;不满足的话&#xff0c;顺序执行呢&#xff1f;比如&#xff1a;header("Content-type:text/html;charsetutf-8");$arr array(array(id&…

帝国cms仿php自媒体新闻系统,帝国CMS仿《砍柴网》源码 专栏自媒体投稿资讯文章新闻网站模板...

在开发妹入手了一套模版&#xff0c;测试效果真心不错这里发出来供大家参考研究源码简介一家拥有全球视野的前沿科技媒体&#xff0c;我们始终秉承观点独到、全面深入、有料有趣的宗旨&#xff0c;在科技与人文之间寻找商业新价值&#xff0c;坚持以人文的视角解读科技&#xf…

【Win10】UAP/UWP/通用 开发之 x:Bind

【Win10】UAP/UWP/通用 开发之 x:Bind [Some information relates to pre-released product which may be substantially modified before its commercially released. Microsoft makes no warranties, express or implied, with respect to the information provided here.] […

SRS文档

负责人&#xff1a;韩朝燕 1什么是用例&#xff1f; 在介始用例方法之前&#xff0c;我们首先来看一下传统的需求表述方式-"软件需求规约"(Software Requirement Specification)。传统的软件需求规约基本上采用的是功能分解的方式来描述系统功能&#xff0c;在这种表…

linux重启网卡的命令行,linux系统重启网卡命令

关于win10系统开机总是要禁用重启网卡才能联网如何解决就为大家介绍到这边了&#xff0c;有遇到同样情况的用户们可以采取上面的方法步骤来解决。问题2已知win7下不需要删除qos协议&#xff0c;在跑无盘模式下以前最好不要安装厂商网卡驱动或修改win7网络协议种类&#xff0c;某…

JS判断客户端是否是iOS或者Android

<script type"text/javascript"> var u navigator.userAgent, app navigator.appVersion; var isAndroid u.indexOf(Android) > -1 || u.indexOf(Linux) > -1; //android终端或者uc浏览器 var isiOS !!u.match(/\(i[^;];( U;)? CPU.Mac OS X/); //i…

linux nginx 缓存服务器,如何开启Nginx缓存

众所周知&#xff0c;Nginx是一个高性能的web服务器&#xff0c;尤其在高并发和处理静态页面的时候有先天的优势&#xff1b;很大一部分得益于缓存的开启&#xff0c;那么如何开启nginx的缓存呢。简单来说可以分两步&#xff1a;1.定义缓存存储目录并指定共享内存空间2.在locat…

linux 安装u盘软件,Universal USB Installer:帮你用U盘装Linux

近期&#xff0c;Linux系统U盘制作安装工具&#xff1a;Universal USB Installer迎来了v1.9.5.1版本&#xff0c;新版支持了OpenSuse 32/64bit系统平台&#xff0c;欢迎Linux桌面爱好者下载使用。Universal USB Installer工具&#xff0c;类似一款U盘制作工具&#xff0c;允许用…

lucene 高亮显示

原文地址&#xff1a; http://blog.csdn.net/javaman_chen/article/details/8224407 Lucene针对高亮显示功能提供了两种实现方式,分别是Highlighter和FastVectorHighlighter。 顾名思义&#xff0c;FastVectorHighlighter较Highlighter速度更快&#xff0c;功能也更强大&…

u盘 轻量linux,3种方法来创建轻量、持久化的Xubuntu Linux USB系统盘

使用Universal USB Install创建持久化USB XUbuntu系统盘这个教程为你介绍如何使用Xubuntu Linux创建一个轻量并且持久化的Linux USB系统盘。译者注&#xff1a;持久化Linux USB系统盘(Persistent Linux USB drive)&#xff0c;安装在优盘的Linux系统&#xff0c;允许用户保存数…

linux u盘加载阵列卡驱动步骤,Linux U盘加载阵列卡驱动步骤

如果没有Linux的机器,可以使用安装光盘的Linux环境&#xff1a;将 U 盘完全慢速格式化&#xff0c;将驱动拷贝到U盘&#xff0c;将U盘插在服务器上&#xff0c;用Linux安装光盘第一张启动到图形安装界面&#xff0c;按Ctrl&#xff0b;Alt&#xff0b;F2切换到控制台。按F11调用…

linux 笔记本键盘灯驱动程序,安装和使用CKB Next在Linux上更改Corsair键盘背光设置...

本文介绍在Ubuntu、Debian、Arch Linux、Fedora、OpenSUSE系统下安装和使用CKB Next的方法&#xff0c;以在Linux系统上更改Corsair键盘背光设置。Corsair键盘非常适合在PC上进行游戏&#xff0c;特别是在夜间&#xff0c;因为它们具有出色的RGB背光功能&#xff0c;用户可以轻…

c++ linux 环境,C++ 环境设置

C 环境设置本地环境设置如果您想要设置 C 语言环境&#xff0c;您需要确保电脑上有以下两款可用的软件&#xff0c;文本编辑器和 C 编译器。文本编辑器这将用于输入您的程序。文本编辑器包括 Windows Notepad、OS Edit command、Brief、Epsilon、EMACS 和 vim/vi。文本编辑器的…

linux安装pgsql源码包解压,在Linux(centos)中使用源码安装pgRouting

目录一、解压pgRouting二、配置PostgreSQL的环境变量三、编译源代码四、测试由于pgRouting依赖于PostGIS和PostgreSQL&#xff0c;所以阅读本文之前&#xff0c;务必请先阅读&#xff1a;Linux(centos)中使用源码安装PostgreSQLLinux(centos)中使用源码安装PostGIS按照以上文章…