当前位置: 首页 > article >正文

表单校验记录

校验数字

<el-form-item
  label="座位数:"
  prop="carInfo.seatNum"
  :rules="{ required: false, message: '请输入数字', trigger: 'blur' ,validator: checkNumber}"
>
  <el-input v-model="quotaForm.carInfo.seatNum" placeholder="请输入"></el-input>
</el-form-item>

方法:


/* 校验数字 */
checkNumber(rule, value, callback) {
  const regex = /^\d+$/;
  if (value.length!==0 && (!value || !regex.test(value))) {
    callback(new Error('请输入正整数!'));
  } else {
    callback();
  }
},

校验数字和两位小数

<el-form-item
  label="保费:"
  prop="insur.bizKind.rmbSum"
  :rules="[{ required: false, message: '请正确输入(数字或者两位小数)!', trigger: 'blur'},{
    validator: checkMoney
  }]"
>
  <el-input v-model="quotaForm.insur.bizKind.rmbSum" placeholder="请输入"></el-input>
</el-form-item>


/* 校验输入金额 */
checkMoney(rule, value, callback) {
  const regex = /^\d+(\.\d{1,2})?$/;
  if (value.length!==0 && (!value || !regex.test(value))) {
    callback(new Error('请输入正整数或者两位小数!'));
  } else {
    callback();
  }
},

http://www.kler.cn/a/442358.html

相关文章:

  • Vue.js组件开发-如何处理跨域请求
  • 虚拟拨号技术(GOIP|VOIP)【基于IP的语音传输转换给不法分子的境外来电披上一层外衣】: Voice over Internet Protocol
  • DM达梦启用及收集AWR报告
  • FLASK创建下载
  • windows11下 podman-desktop 复制插件文件 到 RabbitMQ 容器内,并启用
  • 10 为什么系统需要引入分布式、微服务架构
  • Java并发编程框架之第三方库
  • eclipse 如何设置项目、不同类型文件的 utf8 编码
  • 如何与GPT更高效的问答
  • xxl-job 整合 Seatunnel 实现定时任务
  • Bootstrap Blazor中使用PuppeteerSharp对HTML截图
  • 【嵌入式——QT】QT多线程编程
  • Halcon中dots_image(Operator)算子原理及应用详解
  • JumpServer开源堡垒机搭建及使用
  • 基于yolov10的遥感影像目标检测系统,支持图像检测,视频检测和实时摄像检测功能(pytorch框架,python源码)
  • 计算机网络技术基础:3.计算机网络的拓扑结构
  • 从零开始学TiDB(5)Raft与Multi Raft
  • 【Java】使用RSA进行数字签名详解(复制即用,内有详细注释)
  • 用 Python 从零开始创建神经网络(十七):回归(Regression)
  • 小程序转uniapp之setData
  • RabbitMQ镜像队列机制
  • 【WRF教程第3.4期】预处理系统 WPS 详解:以4.5版本为例
  • python IO编程:序列化
  • android 计算CRC
  • Windows开机黑屏|Windows开机黑屏只有鼠标|Windows开机不运行explorer
  • vue3实现商城系统详情页(前端实现)