Vue input标签 email和手机号输入验证

Vue input标签 email和手机号输入验证

1、 email邮箱验证规则
2、 手机号正则表达式验证规则
vue写法：

<script>
export default {
  data() {
    // 验证手机号的规则
    var cheackMobile = (rule, value, cb) => {
     // 手机号一般最小以“13”开头
      const regMobile = /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/
      if (regMobile.test(value)) {
        return cb
      }
      cb(new Error('请输入合法的手机号!'))
    }
    return {
    	email: '',
        phone: '',
        rules: {
	        email: [
	          { required: true, message: '请输入邮箱', trigger: 'blur' },
	          { type: 'email', message: '请输入正确的邮箱地址', trigger: ['blur', 'change'] }],
	       phone: [
	          { required: true, message: '请输入手机号', trigger: 'blur' },
	          { validator: cheackMobile, trigger: 'blur' }]
    }
  }
}
</script>

运行截图：

标签：Vue,手机号,验证,trigger,blur,input,email,输入
来源： https://blog.csdn.net/weixin_46806380/article/details/122764923