iview表单验证数字
验证输入字符串必须为数字
html:
<FormItem label="兑换积分:" prop="exchangeIntegral">
<Input v-model="formSpecAdd.exchangeIntegral" placeholder="请输入兑换积分" style="width: 250px"></Input>
</FormItem> <FormItem label="库存数量:" prop="stockNum">
<Input v-model="formSpecAdd.stockNum" placeholder="请输入库存数量" style="width: 250px"></Input>
</FormItem> <FormItem label="商品价值:" prop="productMoney">
<Input v-model="formSpecAdd.productMoney" placeholder="请输入商品价值" style="width: 250px"></Input>
</FormItem>
js:
exchangeIntegral: [
{required: true, message: '请输入兑换积分', trigger: 'blur'},
{type: 'string', pattern: /^\d+$/, message: '请输入数字', trigger: 'blur'}
], stockNum: [
{required: true, message: '请输入库存数量', trigger: 'blur'},
{type: 'string', pattern: /^\d+$/, message: '请输入数字', trigger: 'blur'}
], productMoney: [
{required: true, message: '请输入商品价值', trigger: 'blur'},
{type: 'string', pattern: /^\d+$/, message: '请输入数字', trigger: 'blur'}
],
或者: 直接将输入框定义为 number类型
<FormItem label="兑换积分:" prop="exchangeIntegral">
<Input v-model="formSpecAdd.exchangeIntegral" number placeholder="请输入兑换积分" style="width: 250px"></Input>
</FormItem>
js:验证
exchangeIntegral: [
{required: true, type: 'number', message: '请输入兑换积分', trigger: 'blur'},
{type: 'number', message: '请输入数字', trigger: 'blur'}
],
请参考:
https://www.cnblogs.com/chenmz1995/p/10804076.html
https://www.iviewui.com/components/form#ZDYYZ
https://github.com/yiminghe/async-validator
iview表单验证数字的更多相关文章
- iview表单验证--数字必填+校验
直接使用: { required: true, type:"integer", message:"请填写整数", trigger: "blur&quo ...
- iview表单验证下拉框不通过问题
iview表单验证的步骤: 第一步:给 Form 设置属性 rules :rules 第二步:同时给需要验证的每个 FormItem 设置属性 prop 指向对应字段即可 prop=”“ 第三步:注意 ...
- iview表单验证不生效问题注意点
按照iview官网介绍写的form表单验证,但是无论填写与否都不进行校验,找了很久的原因,突然才发现一个关键的地方,一定要加props!!! https://blog.csdn.net/xuaner8 ...
- iview表单验证之正则验证、函数验证
iview表单验证之正则 正则验证: 代码: loginRules: { stringLength: [ { required: true, message: '该字段不能为空', trigger: ...
- 有关使用 iview 表单验证的问题
Vue的UI解决框架,element-UI, iview-UI 有关表单验证使用的是同一个插件,async-validator,有关这个插件的用法就不做赘述,但是在iview表单的使用中可能会用到验证 ...
- iview 表单验证不通过问题?
项目需要,需要怂iview..使用一段时间感觉跟elementUI用起来差不多很方便.使用过程中遇到表单验证问题,如何避免在验证过程中偶尔出现验证不通过的异常情况? <1>:给 <F ...
- vue中使用iview表单验证时this指针问题
需求 使用iview,在提交时对值b进行验证,使其不能大于值a 实现 <Form ref="config" :model="config" :rules= ...
- iview 表单验证
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>& ...
- iview表单验证trigger:'change,blur'
今天发现,如果设置select的trigger:'blur'就算选择之后还是边框是红色的,之后查了一下iview的文档,也没有找到准确的蚊子描述,只看到form那个组件其中有一个例子,大概是selec ...
随机推荐
- iview -- vue modal 显示到最顶层 层级
给想要显示到顶层的modal 设置class属性 .my-modal-parent { position: fixed; // 浮动 z-index:; }
- python中使用requests模块的post()函数时形参 data和json的区别
通常,你想要发送一些编码为表单形式的数据--非常像一个 HTML 表单.要实现这个,只需简单地传递一个字典给 data 参数.你的数据字典在发出请求时会自动编码为表单形式: >>> ...
- python 调用父类方法, 重写父类构造方法, 不显式调用,会报错
子类不显式调用父类的构造方法,而父类构造函数初始化了一些属性,就会出现问题 如果子类和父类都有构造函数,子类其实是重写了父类的构造函数,如果不显式调用父类构造函数,父类的构造函数就不会被执行,导致子类 ...
- 解决jenkins日志爆满 DNS查询错误
一.故障 公司的jenkins因为日志量太大把磁盘占满,进而影响了其他程序,仔细一看日志文件"/var/log/jenkins/jenkins.log"几分钟产生了30G的日志 日 ...
- laydate V5-0-8动态设置min值
laydate通过设置min,max值来对用户输入的时间做约束 laydate v1.0版本 //日期插件 var start={ elem:"#start", format:&q ...
- Java同步数据结构之LinkedBlockingDeque
前言 前面介绍完了队列Queue/BlockingQueue的实现类,接下来介绍双端队列Deque/BlockingDeque的实现类之一LinkedBlockingDeque,它是一种基于链表的可选 ...
- Servlet的运行原理
- linux高可用集群(HA)原理详解
高可用集群 一.什么是高可用集群 高可用集群就是当某一个节点或服务器发生故障时,另一个节点能够自动且立即向外提供服务,即将有故障节点上的资源转移到另一个节点上去,这样另一个节点有了资源既可以向外提供服 ...
- git服务器搭建---便签做备注
今天,简单搭建了一下git服务器.发现一篇文章写的挺好的 http://www.cnblogs.com/trying/archive/2012/06/28/2863758.html 并简单和廖雪峰的结 ...
- JS中的prototype、__proto__与constructor(图解)
作为一名前端工程师,必须搞懂JS中的prototype.__proto__与constructor属性,相信很多初学者对这些属性存在许多困惑,容易把它们混淆,本文旨在帮助大家理清它们之间的关系并彻底搞 ...