Vue 中的简单函数是什么.js可以用来验证输入的格式？

Question

在 Vue 中.js我有这个：

<template>
<button @click="sendMail(); $emit('close')">Send</button>
</template>
<script>
methods: {
sendMail () {
axios.post('/mail', {email: this.email});
this.$notify.make('Sent!', 'success');
},
invalidEmail () {
this.$notify.make('Invalid email format!', 'failure'):
}
}
</script>

当电子邮件输入格式无效时，如何触发invalidEmail()？

Answer 1

您可以使用正则表达式来检查电子邮件的有效性。

正则表达式的来源：http://emailregex.com/

<template>
<button @click="sendMail(); $emit('close')">Send</button>
</template>
<script>
// Here is the regex to test if an email is valid
const mailRegex = /^(([^<>()[]\.,;:s@"]+(.[^<>()[]\.,;:s@"]+)*)|(".+"))@(([[0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}])|(([a-zA-Z-0-9]+.)+[a-zA-Z]{2,}))$/;
module.exports = {
// [...]
methods: {
sendMail () {
// If this.email is not a valid email, abort by return and call this.invalidEmail
if (!mailRegex.test(this.email)) return this.invalidEmail();
axios.post('/mail', {email: this.email});
this.$notify.make('Sent!', 'success');
},
invalidEmail () {
this.$notify.make('Invalid email format!', 'failure'):
}
}
}
</script>