Vue手机号校验规则（无规则、手机号+固定号码、必填、非必填、多个手机号校验）

最新推荐文章于 2024-12-25 10:18:56 发布

KC++.GUO

最新推荐文章于 2024-12-25 10:18:56 发布

阅读量3.1k

点赞数

分类专栏： vue 文章标签： js javascript vue.js

本文链接：https://blog.csdn.net/weixin_43732485/article/details/111479316

版权

本文详细介绍了在Vue项目中进行手机号验证的各种场景，包括必填手机号的校验、非必填手机号的处理、多个手机号的验证规则以及无特定规则的手机号输入情况。通过实例展示了如何在JavaScript和Vue.js中实现这些功能。

摘要由CSDN通过智能技术生成

-------------手机号校验（必填项）

phone:[
    {
      required: true,
      message: '请输入手机号码或者固定电话',
      trigger: 'blur',
    },
    { min: 1, max: 50, message: '输入的号码不能超过50位', trigger: 'blur' },
    {  
      validator: function(rule, value, callback) {
        if(value.indexOf("-") != -1 ){
          if(value.substring(0, 1)=='-'){
            callback(new Error('固定电话不允许-开头，可以有多个-，最多50位'))
          }else{
            for(let char of value){
              if(char!='-'){
                if(!/^[0-9]\d*$/.test(char)){
                  callback(new Error('固定电话只允许录入数字与-'))
                  return
                }
              }
            }
          }
        }else{
          if(!/^(13[0-9]|14[01,4-9]|15[0-3,5-9]|16[5-7]|17[0135678]|18[0-9]|19[189])\d{8}$/.test(value)){
            callback(new Error('请输入标准的手机号码'))
          }
        }
        callback()
      },
      trigger: 'blur',
    },
  ]

-------------手机号校验（非必填项）

phone:[
    {
      required: false,
      message: '请输入手机号码或者固定电话',
      trigger: 'blur',
    },
    { min: 1, max: 50, message: '输入的号码不能超过50位', trigger: 'blur' },
    {
      validator: function(rule, value, callback) {
        if(value && value.indexOf("-") !&

最低0.47元/天解锁文章