验证输入字符串必须为数字

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表单验证数字的更多相关文章

  1. iview表单验证--数字必填+校验

    直接使用: { required: true, type:"integer", message:"请填写整数", trigger: "blur&quo ...

  2. iview表单验证下拉框不通过问题

    iview表单验证的步骤: 第一步:给 Form 设置属性 rules :rules 第二步:同时给需要验证的每个 FormItem 设置属性 prop 指向对应字段即可 prop=”“ 第三步:注意 ...

  3. iview表单验证不生效问题注意点

    按照iview官网介绍写的form表单验证,但是无论填写与否都不进行校验,找了很久的原因,突然才发现一个关键的地方,一定要加props!!! https://blog.csdn.net/xuaner8 ...

  4. iview表单验证之正则验证、函数验证

    iview表单验证之正则 正则验证: 代码: loginRules: { stringLength: [ { required: true, message: '该字段不能为空', trigger: ...

  5. 有关使用 iview 表单验证的问题

    Vue的UI解决框架,element-UI, iview-UI 有关表单验证使用的是同一个插件,async-validator,有关这个插件的用法就不做赘述,但是在iview表单的使用中可能会用到验证 ...

  6. iview 表单验证不通过问题?

    项目需要,需要怂iview..使用一段时间感觉跟elementUI用起来差不多很方便.使用过程中遇到表单验证问题,如何避免在验证过程中偶尔出现验证不通过的异常情况? <1>:给 <F ...

  7. vue中使用iview表单验证时this指针问题

    需求 使用iview,在提交时对值b进行验证,使其不能大于值a 实现 <Form ref="config" :model="config" :rules= ...

  8. iview 表单验证

    <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>& ...

  9. iview表单验证trigger:'change,blur'

    今天发现,如果设置select的trigger:'blur'就算选择之后还是边框是红色的,之后查了一下iview的文档,也没有找到准确的蚊子描述,只看到form那个组件其中有一个例子,大概是selec ...

随机推荐

  1. Django中的 返回json对象的方式

    在返回json对象的几种方式: 1 from django.shortcuts import render, HttpResponse # Create your views here. from d ...

  2. Java同步数据结构之ConcurrentLinkedDeque

    前言 由于LinkedBlockingDeque作为双端队列的实现,采用了单锁的保守策略使其不利于多线程并发情况下的使用,故ConcurrentLinkedDeque应运而生,它是一种基于链表的无界的 ...

  3. oracle传输表空间

    https://blog.csdn.net/ch7543658/article/details/39271135/ Oracle expdp/impdp常用性能优化方法 1.查看操作系统endiann ...

  4. kotlin泛型类型变异

    在java泛型中中会有 ? extends E 可以解决类似于List<String> 赋给List<Object>  的问题,但是在kotlin泛型中并没有提供通配符,而是o ...

  5. 阶段5 3.微服务项目【学成在线】_day02 CMS前端开发_08-vuejs研究-vuejs基础-v-if和v-for指令

    1.2.4 v-if和v-for <!DOCTYPE html> <html lang="en"> <head> <meta charse ...

  6. vue+大文件断点续传

    根据部门的业务需求,需要在网络状态不良的情况下上传很大的文件(1G+).其中会遇到的问题:1,文件过大,超出服务端的请求大小限制:2,请求时间过长,请求超时:3,传输中断,必须重新上传导致前功尽弃.解 ...

  7. 简单范例php调用C# WebService

    准备工作:1. 安装IIS对于PHP的支持,看这里2. 要调用Web Service需要nusoap支持,只要弄个nusoap.php就可以了,把它放在要运行的php文件能够引用的地方,比如我放在同一 ...

  8. 【计算机视觉】深度相机(九)--OpenNI API及中间件说明

    本文由官方文档翻译而来 总览 目的 OpenNI 2.0 API(应用程序编程接口)提供了访问PrimerSense的兼容深度传感器.这就使得一个应用程序能够初始化传感器和从设备接收深度(depth) ...

  9. Memcache分布式锁

    在分布式缓存的应用中,会遇到多个客户端同时争用的问题.这个时候,需要用到分布式锁,得到锁的客户端才有操作权限 下面通过一个简单例子介绍: 这里引用的是Memcached.ClientLibrary.d ...

  10. JS中删除数组中的元素方法

    删除指定下标数组元素 Array.prototype.del=function(index){ if(isNaN(index)||index>=this.length){ return fals ...