ref 给

<van-form @submit="onSubmit" ref="form"> 标签 ;
  // 检验手机号是否合格
await this.$refs.form.validate("mobile");

data里面定义的规则 rules对象 ;

  rules: {
mobile: [
// 必填
{ required: true, message: "请填写用户名" },
// 1 3-9 开头 在家 9 个0-9数字
{ pattern: /^1[3-9]\d{9}$/, message: "手机号不正确" },
],
code: [
{ required: true, message: "请填写密码" },
{ pattern: /\d{6}$/, message: "验证码错误" },
],
},

使用规则:

   <van-field
v-model="user.mobile"
name="mobile"
icon-prefix="zlx"
left-icon="shouji"
maxlength="11"
placeholder="请输入手机号"
:rules="rules.mobile"
/>

vant2 自动检查表单验证 -validate的更多相关文章

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

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

  2. lumen手记:自定义Validate表单验证

    版权声明:本文为博主原创文章,未经博主允许不得转载. 今天开始跳lumen的表单验证Validate类的坑,确实好坑!!! 首先,lumen的表单验证返回是无状态的json格式api,这... 所有开 ...

  3. jQuery Validation Engine 表单验证

    功能强大的 jQuery 表单验证插件,适用于日常的 E-mail.电话号码.网址等验证及 Ajax 验证,除自身拥有丰富的验证规则外,还可以添加自定义的验证规则. 兼容 IE 6+, Chrome, ...

  4. Validation Engine 表单验证

    前端开发仓库 » jQuery » jQuery Validation Engine 表单验证 jQuery Validation Engine 表单验证来源 功能强大的 jQuery 表单验证插件, ...

  5. 表单验证——JavaScript和Jquery版

    1.轻量级的JavaScript表单验证 在应用中引用 validator.min.js 文件 <script type="text/javascript" src=&quo ...

  6. jquery validate表单验证插件-推荐

    1 表单验证的准备工作 在开启长篇大论之前,首先将表单验证的效果展示给大家.     1.点击表单项,显示帮助提示 2.鼠标离开表单项时,开始校验元素  3.鼠标离开后的正确.错误提示及鼠标移入时的帮 ...

  7. 表单验证——jquery validate使用说明【另一个教程】

    [参考:http://www.tuicool.com/articles/y6fyme] jQuery Validate jQuery Validate 插件为表单提供了强大的验证功能,让客户端表单验证 ...

  8. jquery validate表单验证插件

    1 表单验证的准备工作 在开启长篇大论之前,首先将表单验证的效果展示给大家.     1.点击表单项,显示帮助提示 2.鼠标离开表单项时,开始校验元素  3.鼠标离开后的正确.错误提示及鼠标移入时的帮 ...

  9. Jquery.validate.js表单验证插件的使用

    作为一个网站web开发人员,以前居然不知道还有表单验证这样好呀的插件,还在一行行写表单验证,真是后悔没能早点知道他们的存在. 最近公司不忙,自己学习一些东西的时候,发现了validation的一个实例 ...

  10. 从零开始学习jQuery (十一) 实战表单验证与自动完成提示插件

    一.摘要 本系列文章将带您进入jQuery的精彩世界, 其中有很多作者具体的使用经验和解决方案,  即使你会使用jQuery也能在阅读中发现些许秘籍. 本文是介绍两个最常用的jQuery插件. 分别用 ...

随机推荐

  1. 【MySQL】下发功能SQL

    SQL参考文章: https://www.jb51.net/article/15627.htm 下发,就是从别的表中同步数据到此表中,也可能是来自不同库的表,或者不同实例的表 下发的逻辑要求:如果没有 ...

  2. 【MySQL】30 备份与恢复

    1.备份命令: mysqldump -u用户名 -p 密码 -h 服务主机IP -P 端口号 \ 数据库名称 \ > 指定备份的sql脚本文件位置 ↓ # 文件位置样例: # C:\Users\ ...

  3. 【转载】 PID原理与参数调试

    原文地址: http://m.elecfans.com/article/1153309.html --------------------------------------------------- ...

  4. 国内网友搭建的 Huggingface 镜像站 —— https://hf-mirror.com/

    huggingface是什么这里不作解释. hugggingface的网站访问同Google一样,不能直接通过浏览器访问,需要科学的方式才可以,这里假设大家是知道如何访问Google的: huggin ...

  5. 零基础学习人工智能—Python—Pytorch学习(三)

    前言 这篇文章主要两个内容. 一,把上一篇关于requires_grad的内容补充一下. 二,介绍一下线性回归. 关闭张量计算 关闭张量计算.这个相对简单,阅读下面代码即可. print(" ...

  6. 微服务架构SpringCloud的理解

    微服务架构是什么? 微服务是一种架构思想,实际上以分布式系统方式开发.架构是为了解耦.该架构解决的是分布式中的四个问题: 一.客户端如何访问众多服务: 应用划分为众多服务以后,客户端需要如何访问? 通 ...

  7. SMU Spring 2023 Contest Round 5(2023 (ICPC) Jiangxi Provincial Contest -- Official Contest)

    题目链接 Problem A. Drill Wood to Make Fire S * V >= n即可 #include<bits/stdc++.h> #define int lo ...

  8. iframe出现双层滚动条解决方案

    在开发中出现一个iframe双滚动条问题,查了很多资料,网上的解决方案是定义iframe的onload事件,加载时重新加载高度,但是由于项目中页面渲染完成后,点击按钮动态生成数据,这时候上面的方案就不 ...

  9. ubuntu16.04/CentOS 7自动以root身份登录桌面

    ubuntu16.04 1.首先设置root用户密码: # sudo passwd root 输入普通用户密码,再输入root用户密码: 2.启用登录时的root选项: # 编辑50-ubuntu.c ...

  10. QTreeWidget折叠子项(折叠当前项的所有子项)

    QTreeWidget折叠子项(折叠当前项的所有子项) 本文仅供本人知识总结使用,所以内容会比较浅显,不喜勿喷. 文章目录 QTreeWidget折叠子项(折叠当前项的所有子项) 一.仅折叠子项 二. ...