如何检查电子邮件是否存在于 vuetifyjs 规则中
How to check email is exist in vuetifyjs rules
我正在使用带规则的 vuetify 表单验证
我在异步验证电子邮件存在时遇到问题
此规则代码:
data () {
return {
rules: {
email: value => {
const pattern = /^(([^<>()[\]\.,;:\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,}))$/
return pattern.test(value) || 'Invalid e-mail.'
},
mailExist: value => (this.emailExists(value) === 'valid Email Address') || 'Error'
},
}
},
此方法代码 运行 确保 mailExist 验证:
methods: {
emailExists: function (val) {
if (val !== '') {
axios.get(`email_validation.php?empemail=${val}`)
.then(response => {
console.log(response.data)
return response.data
})
.catch(err => {
console.log(err)
})
}
},
},
结果始终是 'Error' 但 api 的响应是 True,如图所示:
Picture
此代码 PHP API:
<?php
require "../includes/DbOperations.php";
$result = array();
if ($_SERVER['REQUEST_METHOD'] == 'GET')
{
if (isset($_GET['empemail']))
{
$db = new DbOperations();
if (filter_var($_GET['empemail'], FILTER_VALIDATE_EMAIL))
{
if ($db->email_validation($_GET['empemail']))
{
$result = "This Email Already Exist";
}
else
{
$result = "valid Email Address";
}
}
else
{
$result = " Invalid Email Address";
}
}
else
{
$result = "Invalid Inputs";
}
}
else
{
$result = "You Do Not Have Permission";
}
echo json_encode($result);
谢谢你..
我这样解决了问题..
在电子邮件字段中:
<v-text-field
label="Email Address"
type="email"
class="purple-input"
:rules="[rules.email, rules.existingMail]"
v-model="email"
:messages="mailMessage"
@keyup="emailExists()"
/>
数据和规则对象:
data () {
return {
email: '',
rules: {
required: value => !!value || 'Required.',
email: value => {
const pattern = /^(([^<>()[\]\.,;:\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,}))$/
return pattern.test(value) || 'Invalid e-mail.'
},
existingMail: () => true || this.mailMessage
},
mailMessage: '',
}
},
在方法中:
methods: {
emailExists: function () {
if (this.email !== '') {
axios.get(`email_validation.php?empemail=${this.email}`)
.then(response => {
if (response.data !== 'valid Email Address') {
this.mailMessage = response.data
this.rules.existingMail = false
} else {
this.mailMessage = ''
this.rules.existingMail = true
}
})
.catch(err => {
console.log(err)
})
}
},
}
也许有更好的方法来解决这个问题,但我的方法很好..
我正在使用带规则的 vuetify 表单验证 我在异步验证电子邮件存在时遇到问题
此规则代码:
data () {
return {
rules: {
email: value => {
const pattern = /^(([^<>()[\]\.,;:\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,}))$/
return pattern.test(value) || 'Invalid e-mail.'
},
mailExist: value => (this.emailExists(value) === 'valid Email Address') || 'Error'
},
}
},
此方法代码 运行 确保 mailExist 验证:
methods: {
emailExists: function (val) {
if (val !== '') {
axios.get(`email_validation.php?empemail=${val}`)
.then(response => {
console.log(response.data)
return response.data
})
.catch(err => {
console.log(err)
})
}
},
},
结果始终是 'Error' 但 api 的响应是 True,如图所示: Picture
此代码 PHP API:
<?php
require "../includes/DbOperations.php";
$result = array();
if ($_SERVER['REQUEST_METHOD'] == 'GET')
{
if (isset($_GET['empemail']))
{
$db = new DbOperations();
if (filter_var($_GET['empemail'], FILTER_VALIDATE_EMAIL))
{
if ($db->email_validation($_GET['empemail']))
{
$result = "This Email Already Exist";
}
else
{
$result = "valid Email Address";
}
}
else
{
$result = " Invalid Email Address";
}
}
else
{
$result = "Invalid Inputs";
}
}
else
{
$result = "You Do Not Have Permission";
}
echo json_encode($result);
谢谢你..
我这样解决了问题..
在电子邮件字段中:
<v-text-field
label="Email Address"
type="email"
class="purple-input"
:rules="[rules.email, rules.existingMail]"
v-model="email"
:messages="mailMessage"
@keyup="emailExists()"
/>
数据和规则对象:
data () {
return {
email: '',
rules: {
required: value => !!value || 'Required.',
email: value => {
const pattern = /^(([^<>()[\]\.,;:\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,}))$/
return pattern.test(value) || 'Invalid e-mail.'
},
existingMail: () => true || this.mailMessage
},
mailMessage: '',
}
},
在方法中:
methods: {
emailExists: function () {
if (this.email !== '') {
axios.get(`email_validation.php?empemail=${this.email}`)
.then(response => {
if (response.data !== 'valid Email Address') {
this.mailMessage = response.data
this.rules.existingMail = false
} else {
this.mailMessage = ''
this.rules.existingMail = true
}
})
.catch(err => {
console.log(err)
})
}
},
}
也许有更好的方法来解决这个问题,但我的方法很好..