Element UI定义方法校验邮箱格式

1. .vue中定义了3个邮箱输入框，前面两个是输入多个邮件地址，最后一个是使用element自带的校验来校验单个邮件地址

    

2. js定义校验规则

注意： 校验规则rules中若想调用方法，那么这个方法必须放到data的子定义中，如果是放到methods中无法调用

export default {
	//...
  data() {
    var checkEmail = (rule, value, callback) => { //邮箱校验  ---只有在data()里面定义的方法能在data中的return里面的rules中的某些规则中调用，也就是这些方法需要在methods同级中定义，如果在methods中定义是无法在rules中调用的
      const mailReg = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(.[a-zA-Z0-9_-])+/ ;
      const emails = value.split(';'); 
      if (!value) {
        return callback('邮箱地址不能为空');
      }
      setTimeout(() => {
        for (let i = 0; i < emails.length; i++) {  
          console.log('邮箱地址:' + emails[i].trim());
          if (!mailReg.test(emails[i].trim())) {  
            callback("邮箱地址格式不正确： "+ emails[i].trim());  
          }  
        }  
        callback();  // 所有邮件地址都合法
      }, 100)
    } 
    return {
		//... 
      rules: {// 表单校验
        to: [{ validator: checkEmail, trigger: 'blur' }],
        cc:[{ validator: checkEmail, trigger: 'blur' }],
        email: [{type: "email", message: "请输入正确的邮箱地址", trigger: ["blur", "change"]}]
      }
    };
  },
  methods: {
	 // ...
  }
  
  
};