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. 【Android】看安卓代码的一点笔记

    最近项目需要把安卓项目拉下来看了 简单来说的话,网页是HTML + CSS + JS 组成的,运行环境是浏览器上面 安卓APP应用是 Java + XML 组成的,运行环境是这个安卓系统中 构成结构 ...

  2. 【Java】逻辑错误BUG

    开局一张图来解释就够了 查询 COUNT() 结果数,有且仅有一条记录 好死不死判断查询的结果数量等等于0, 这不永远都是取TRUE返回 花了一个下午的时间就为了解决这个BUG

  3. 【Java,IDEA】配置文件快速生成

    比如这里的druid连接配置文件,和mybatis的mapper配置文件就是使用模版创建好的 在创建文件时会有选项选择:

  4. 日本联合研究团队发布 Fugaku-LLM——证明大型纯 CPU 超算也可用于大模型训练

    相关: https://mbd.baidu.com/newspage/data/landingsuper?context={"nid"%3A"news_101396655 ...

  5. TensorBoard标量图中的平滑曲线是如何做的平滑?—— tensorflow TensorBoard标量图中“平滑”参数背后的数学原理是什么?—— 指数移动平均(EMA)

    TensorFlow的tensorboard的平滑曲线的实现代码: 使用"指数移动平均"技术实现. 地址: https://github.com/tensorflow/tensor ...

  6. 开源机器学习版本的Github:Hugging Face

    参考: https://baijiahao.baidu.com/s?id=1776478347325976510 https://zhuanlan.zhihu.com/p/535100411 ==== ...

  7. 为啥华为Atlas的AI卡在二手市场上特别多

    首先阐述一下事实,那就是华为Atlas的AI卡在二手市场上特别多,基本上在某鱼上一搜索就是满屏,尤其是关键词:华为Atlas300,但是作为同等level的NVIDIA公司的A100却较之相比少的多, ...

  8. 关于mysql配置文件中jdbc url 的记录

    版本不同 url不同 大同小异 基本就是不同参数配置的区别 maven 仓库地址 https://mvnrepository.com/artifact/mysql/mysql-connector-ja ...

  9. kali常用配置

    用户须知 1.免责声明:本教程作者及相关参与人员对于任何直接或间接使用本教程内容而导致的任何形式的损失或损害,包括但不限于数据丢失.系统损坏.个人隐私泄露或经济损失等,不承担任何责任.所有使用本教程内 ...

  10. 再探se

    对象 没有分配内存空间的对象是一个特殊的对象 null null是引用类型的,但是没有指向任何位置,所以是不能被访问的,强制访问会空指针异常 针对具体对象的属性称之为对象属性,成员属性,实例属性 针对 ...