首页 > 其他分享 >vue 手机规则校验

vue 手机规则校验

时间:2023-10-16 17:56:14浏览次数:27  
标签:11 vue 规则 校验 trigger blur message

一、背景

点击查看代码
phone: [
        { required: true, message: '请输入手机号', trigger: 'blur' },
        { min: 11, max: 11, message: '手机号位数不对', trigger: 'blur' },
        {
          pattern: /^(13[0-9]|14[579]|15[0-3,5-9]|16[6]|17[0135678]|18[0-9]|19[89])\d{8}$/,
          message: '手机格式不正确',
          trigger: ['blur', 'change'],
        },
    ],

二、实现

三、遇到的报错

四、参考博客

标签:11,vue,规则,校验,trigger,blur,message
From: https://www.cnblogs.com/lcaiqin/p/17767980.html

相关文章

  • 第二十一篇 - vue中实现页面刷新以及局部刷新的方法
    参考链接:https://blog.csdn.net/qq_41117240/article/details/127275478第一步:在需要局部刷新的标签添加 第二步:在data里面初始化isRefresh的值为true 第三步:在method里面添加刷新函数 第四步:在需要局部刷新的地方调用刷新函数this.updateRefresh()......
  • Vue组件的基本概念与使用
    在Vue中,组件是构建用户界面的基本单元之一。它允许开发者将界面拆分为独立、可重用的模块,使代码更加结构化、易于维护。本文将从简单到复杂,全面介绍Vue组件的各种用法、优点、缺点以及注意事项。公众号:Code程序人生,个人网站:https://creatorblog.cn组件的基本概念组件是Vue的核心概......
  • 探索Vue生命周期钩子函数:从创生到销毁
    Vue这个引领前端开发潮流的框架,其优雅的响应式数据绑定和组件式开发方式,使得它备受瞩目。然而,Vue的魅力绝不仅限于此,它还赋予开发者一组神奇的生命周期钩子函数,能够在组件的各个成长阶段插入自定义代码。本文将带你进入Vue生命周期钩子函数的奇妙世界,一探它们的妙用、内部机制,同时......
  • vue - 父子通信
    .sync修饰符:弹框显示隐藏功能:  a.需要定义ref、prop、自定义方法.(1).使用sync://父组件<Toggle:show.sync='show'/>//Toggle组件<divv-if="show">展示和隐藏组件</div><button@click="test">隐藏组件</button>exportdefault{......
  • VA01/VA02/VA03 销售订单根据定价和步骤校验权限隐藏价格
    1、业务需求针对用户使用销售订单时,根据定价和步骤顺序,判断是否有权限,没有权限时隐藏销售订单抬头和行项目的部分价格数据要限制的定价和步骤在spro中的位置限制的步骤2、增强实现2.1权限对象创建带有定价和步骤的权限对象分配权限2.2、隐藏抬头和行项目价格隐藏抬头......
  • vue锚点跳转
    直接上答案//获取dom元素constele=this.$refs['refName'];//获取元素距视窗的高度consttop1=ele?ele.getBoundingClientRect().top:0;//如果ref是在v-for中定义的,需如下获取consttop1=ele?ele[0].getBoundingClientRect().top:0;//获取滚动条的位置c......
  • vue自定义样式
    在项目中常常遇到一些页面由后台定制样式呈现,这就需要在页面中动态绑定style,如若定制样式里包含了伪类、媒体查询、hover效果能样式,寻常的v-bind:style内联样式可能就无法满足需求,这里就记录了一个解决办法。那么该如何操作呢,简单举个栗子:首先,我们在需要定制的样式元素上定义一......
  • vue移动鼠标画矩形(抄别人的,下附原文地址)
    1、draw.js/***画布中绘制矩形*参数:cav-画布对象list-矩形数组i-选中矩形下标**//*操作执行方法分发*/exportfunctiondraw(cav,list,i){//画布初始化letctx=cav.getContext('2d');ctx.strokeStyle='blue';ctx.lineWidth=2;......
  • Vue学习笔记(十一):路由管理
      1Vue路由基本使用¶1.1安装¶Vue中默认并不提供路由功能,需要安装其插件Vue-router,如下所示,其中“@3”表示安装版本[email protected]创建路由¶在src目录下创建路由文件目录,目录名为“router”,并在该目录下创建“index.js”文件,文件内容如下所示,代码......
  • 全志芯片bsp命名规则 sunxi
    全志芯片bsp命名规则DOT小文哥于2022-07-2514:34:57发布阅读量2.1k收藏9点赞数4分类专栏:全志-FAQ文章标签:linux版权全志-FAQ专栏收录该内容142篇文章24订阅订阅专栏在linuxbsp中,allwinner平台统一命名为“sunxi”。即:linuxbsp中的“sunxi”可以理解为是allwinne......