Vue前端验证一个text只能输入手机号或邮箱

直接上代码：

element-ui 内部 text：

检查对象： 

let checkPhoneOrEmail = function (rule,value,callback) { //这个对象同时校验phone和email
        const mailReg = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(.[a-zA-Z0-9_-])+/; //邮箱验证
        const reg = /(^1\d{10}$)|(^[0-9]\d{7}$)/; //手机号验证
        if (! value) {
          return callback(new Error('用户名不能为空'))
        }else{
          if(value.indexOf("@") > 0 ){ //含有字母@
            setTimeout(() => {
              if (mailReg.test(value)) {
                callback()
              } else {
                callback(new Error('邮箱格式不正确'))
              }
            }, 100)
          }else{
            let re = new RegExp(reg);
            if (!re.test(value)) {
              callback(new Error('手机号格式不正确'));
            } else {
              callback();
            }
          }
        }
      };

规则限定： 

 rules: {
          username: [{required: true, message: 'a', trigger: 'blur'},
                    {validator: checkPhoneOrEmail, trigger: 'blur'}], //validator传入一个对象
 }