vue中表单验证特殊字符、数据大小长度、经纬度、数组

2023-11-11

vue中表单验证特殊字符、数据大小长度、经纬度、数组

/**
 * 验证不可输入特殊字符
 * @param {*} rule
 * @param {*} value
 * @param {*} callback
 */
export function checkInputString(rule, value, callback) {
  if (value) {
    if (value.match(/^[\u4E00-\u9FA5A-Za-z0-9_]+?$/)) {
      callback()
    } else {
      callback(new Error('不可输入特殊字符'))
    }
  }
}
/**
 * 验证数字可为正负,数值大小,小数位数验证 参数 isNegative(是否可为负数,默认为false),maxValue(不超过的最大值,默认为10000000),decimal(小数位数,默认7位)
 * @param {*} rule
 * @param {*} value
 * @param {*} callback
 */
export function checkDecimal(rule, value, callback) {
  if (value) {
    value += ''
    var negative = rule.isNegative ? rule.isNegative : false
    var maxValue = rule.maxValue ? rule.maxValue : 10000000
    var minValue = 0
    var decimal = rule.decimal ? rule.decimal : 7
    if (rule.decimal === 0) {
      decimal = 0
    }
    var re = null
    if (negative) {
      minValue = '-' + maxValue
      // eslint-disable-next-line no-eval
      re = eval('/^(\\-)?(0|[1-9][0-9]*)(\\.\\d{0,' + decimal + '})?$/')
    } else {
      // eslint-disable-next-line no-eval
      re = eval('/^(([1-9]{1}\\d*)|(0{1}))(\\.\\d{0,' + decimal + '})?$/')
    }
    if (isNaN(value)) {
      callback(new Error('请输入数字'))
    } else {
      if (value.match(re)) {
        var num = parseFloat(value)
        if (negative) {
          if (num > minValue && num < maxValue) {
            callback()
          } else { callback(new Error('超出有效输入范围')) }
        } else {
          if (num >= minValue && num < maxValue) {
            callback()
          } else { callback(new Error('超出有效输入范围')) }
        }
      } else {
        callback(new Error('输入有误'))
      }
    }
  } else { callback() }
}
/**
 * 验证数字输入范围在0-10000000之间,且小数可7位
 * @param {*} rule
 * @param {*} value
 * @param {*} callback
 */
export function checkNumber(rule, value, callback) {
  if (value) {
    value += ''
    if (value.match(/^\d+$/)) {
      var num = parseFloat(value)
      if (num >= 0 && num < 10000000) {
        callback()
      } else { callback(new Error('超出有效输入范围')) }
    } else {
      callback(new Error('请输入正整数'))
    }
  } else { callback() }
}
/**
 * 验证经度输入范围在-180-180之间,且小数可7位
 * @param {*} rule
 * @param {*} value
 * @param {*} callback
 */
export function checkLon(rule, value, callback) {
  if (value) {
    value += ''
    if (value.match(/^(\-|\+)?(((\d|[1-9]\d|1[0-7]\d|0{1,3})\.\d{0,7})|(\d|[1-9]\d|1[0-7]\d|0{1,3})|180\.0{0,6}|180)$/)) {
      callback()
    } else {
      callback(new Error('经度为-180~180,小数限7位!'))
    }
  } else {
    callback()
  }
}
/**
 * 验证纬度输入范围在-180-180之间,且小数可7位
 * @param {*} rule
 * @param {*} value
 * @param {*} callback
 */
export function checkLat(rule, value, callback) {
  if (value) {
    value += ''
    if (value.match(/^(\-|\+)?([0-8]?\d{1}\.\d{0,7}|90\.0{0,6}|[0-8]?\d{1}|90)$/)) {
      callback()
    } else {
      callback(new Error('纬度为-90~90,小数限7位'))
    }
  } else {
    callback()
  }
}
/**
 * 验证输入长度
 * @param {*} rule
 * @param {*} value
 * @param {*} callback
 */
export function checkLong(rule, value, callback) {
  if (value) {
    if (value.length < rule.length && value.length >= 0) {
      callback()
    } else {
      callback(new Error('输入不可超过' + rule.length + '个字符'))
    }
  } else {
    callback()
  }
}

/**
 * 验证不能为空
 * @param {*} rule
 * @param {*} value
 * @param {*} callback
 */
export function checkNull(rule, value, callback) {
  if (!value) {
    if (value === 0) { callback() } else {
      callback(new Error(rule.message))
    }
  } else {
    value += ''
    if (value.length > 0) {
      callback()
    } else { callback(new Error(rule.message)) }
  }
}
/**
 * 验证数组
 * @param {*} rule
 * @param {*} value
 * @param {*} callback
 */
export function checkArray(rule, value, callback) {
  console.log(value)
  if (value.length > 0) {
    callback()
  } else {
    callback(new Error(rule.message))
  }
}


调用

import { checkDecimal, checkAngle, checkLon, checkLat, checkNull, checkArray, checkLong } from '@/utils/verification'

 formRules: {        
        name: [
          { required: true, message: '请输入名字', validator: checkNull, whitespace: true, trigger: 'blur' },
          { validator: checkDecimal, maxValue: 100000, decimal: 5, trigger: 'blur' }
        ],           
        location: [{ validator: checkLong, length: 18, trigger: 'blur' }],        
      },

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

vue中表单验证特殊字符、数据大小长度、经纬度、数组 的相关文章

随机推荐

  • 解决Tensorflow读取MNIST数据集时网络超时问题

    最近在学习TensorFlow 比较烦人的是使用tensorflow examples tutorials mnist input data读取数据 from tensorflow examples tutorials mnist impo
  • cmake:file

    文件操作命令 这个命令专用于需要访问文件系统的文件和路径操作 对于其他仅处理语法方面的路径操作 请查看cmake path 命令 概要 Reading file READ
  • 南昊网上阅卷系统服务器地址,南昊网上阅卷系统全攻略

    扫描网上阅卷系统的分类 南昊扫描客观题阅卷系统 南昊扫描单机阅卷系统 南昊扫描网上阅卷系统 校园版 南昊扫描网上阅卷系统 中考版 南昊扫描网上阅卷系统 行业考试版 南昊扫描海军民主评议系统 南昊扫描教学质量评测系统 南昊扫描行风评议系统 网
  • hexo部署码云

    在本地搭建好博客后我们需要把博客部署在服务器上 这里没有购买服务器的情况下 就暂时部署在码云或者github上也是可以滴 如果之前部署过github的童鞋应该很快就上手了 都差不多的 这里就没有配置本地公钥了 直接使用是http链接方式 g
  • 利用k8s部署nginx

    这只是一个简单的demo测试 记录下第一次部署应用哈哈哈哈 运行指令创建有四个副本的nginx 这点和docker挺像的 root master kubectl run nginx image nginx latest replicas 4
  • Java实现从FTP获取文件下载到本地,并读取文件中的内容的成功案例

    package com aof web servlet import java io BufferedReader import java io File import java io FileInputStream import java
  • 考虑virtual函数以外的其他选择——条款35

    假设你正在写一个视频游戏软件 你打算为游戏内的人物设计一个继承体系 你的游戏术语暴力砍杀类型 剧中人物被伤害或因其他因素而降低健康状态的情况并不罕见 你因此决定提供一个成员函数healthValue 它会返回一个整数 表示人物的健康程度 由
  • 15个变态的Google面试题以及答案

    在当前经济形势不景气的情况下 谷歌招聘新员工是一件令人振奋的事 特别是对那些在当前金融风暴中渴望找到安全港的年轻经理们和软件开发商们来说是个好消息 不过 也不要高兴太早 谷歌在招聘新员工时 更加青睐名牌大学的学生 即便你是人到中年 招聘时谷
  • 利用顺序栈判断一个字符串是否是对称串

    利用一个顺序栈 判断一个字符串是否是对称串 所谓对称串是指从左向右读和从右向左读的序列相同 有些类似上一篇博客所说的回文 解题思路 对于字符串str 先将其所有元素进栈 从头开始扫描str 同时出栈元素 将出栈元素与从头开始扫描的str元素
  • 第五章 Linux磁盘与文件系统管理

    目录 认识EXT2文件系统 EXT2 EXT3文件的访问与日志文件系统的功能 VFS 文件系统的简单操作 磁盘与目录的容量 df du 连接文件 ln 硬连接和复制的区别 磁盘的分区 格式化 检验与挂载 磁盘分区 fdisk 磁盘检查 fs
  • Python网络编程:socket包的用法

    持续补充 1 网络编程 网络编程 主要用于两台或多台计算机之间的通信 也可以是同一台计算机内不同进程之间的通信 Socket套接字可以用来实现网络通信 关于Socket套接字 需要注意以下几点 Socket是网络通信中应用层和传输层之间的一
  • dbnet ICPAR2015数据格式json制作

    dbnet json格式制作 说明 json格式 代码 说明 dbnet代码选自https github com WenmuZhou DBNet pytorch 训练时数据集信息以json导入 但是官方ICPAR2015数据集下载数据是tx
  • 20个经典模拟电路(详细图文)

    为电子工程师的你 已经掌握了多少模拟电路呢 还应该掌握多少图纸和原理呢 本文列举了20个最常见的电路 并粗略的推断出不同层次的发烧对线路的不同理解程度 快来对照看看你是哪个程度的电子工程师 一 桥式整流电路 注意要点 1 二极管的单向导电性
  • Django 快速搭建博客 第七节(文章详情页,markdown语法)

    版权声明 更多最新原创文章请访问 最新原创主页 更多最全原创文章请访问 更多原创主页 上一节我们把真正的index html显示出来了 只是一个摘要 接下来我们要做的是当我们点击标题或者继续阅读的时候 会打开详情页 1 base html的
  • 页面之间传递值方法

    方式1 在接收页 的html代码里加上一行 WebForm1 fp WebForm1 Context Handler this TextBox1 Text fp name name 是第一页的public变量 Context 提供对整个当前
  • Kotlin中的字符串比较

    在java中 执行比较运算的操作一般有 和 equals 两个操作符 而且在java中 比较的是两个字符串的引用是否相同 而 equals 则是比较两个字符串的内容是否相同 我们可以通过一个例子来进行一下验证 String a1 ab St
  • devops理论梳理

    devops理论梳理 是什么 维基百科解释 DevOps 开发 Development 与运维 Operations 的组合词 是一种文化 一场运动或实践 强调在自动化软件交付流程及基础设施变更过程中 软件 开发人员与其他信息技术 IT 专
  • 寄存器、缓存、内存之间的区别

    简单的讲 寄存器就是CPU直接拿他里面寄存的东西直接来进行计算操作的 它就是CPU的一部分 寄存器是有限存贮容量的高速存贮部件 它们可用来暂存指令 数据和位址 在中央处理器的控制部件中 包含的寄存器有指令寄存器 IR 和程序计数器 PC 在
  • Web3创新者之夜,与其他开发者一同畅谈波卡生态

    Token2049在即 许多开发者都将在9月中齐聚新加坡 一同讨论区块链生态发展及未来 届时将会有超过1万名与会者 并有超过300个赞助商和项目协助支持本次大会 波卡作为跨链互操作性的龙头生态也将参与至本次盛会之中 为了让波卡社区的成员 贡
  • vue中表单验证特殊字符、数据大小长度、经纬度、数组

    vue中表单验证特殊字符 数据大小长度 经纬度 数组 验证不可输入特殊字符 param rule param value param callback export function checkInputString rule value