微客导航 » 文章资讯 » vue中手机号,邮箱正则验证以及60s发送验证码的实例

vue中手机号,邮箱正则验证以及60s发送验证码的实例

2023-09-15 08:28:05 357

今天写了一个简单的验证，本来前面用的组件，但是感觉写的组件在此项目不是很好用，由于用到的地方比较少，所以直接写在了页面中。




{{btntxt}}

这里是script里的内容

exportdefault{
data:function(){
return{
disabled:false,
time:0,
btntxt:"获取验证码",
formMess:{
email:this.email,
phone:this.phone
}
}
},
mounted:function(){

},
methods:{
//验证手机号码部分
sendcode(){
varreg=11&&/^((13|14|15|17|18)[0-9]{1}\d{8})$/;
//varurl="/nptOfficialWebsite/apply/sendSms?mobile="+this.ruleForm.phone;
if(this.phone==''){
alert("请输入手机号码");
}elseif(!reg.test(this.phone)){
alert("手机格式不正确");
}else{
this.time=60;
this.disabled=true;
this.timer();
/*axios.post(url).then(
res=>{
this.phonedata=res.data;
})*/
}
},
timer(){
if(this.time>0){
this.time--;
this.btntxt=this.time+"s后重新获取";
setTimeout(this.timer,1000);
}else{
this.time=0;
this.btntxt="获取验证码";
this.disabled=false;
}
},
query(){
varformMess=this.formMess
Axios.post(api+"/order/select/reception",formMess)
.then(function(res){
if(res.data.code==200){
console.log(res.data.data);
this.productResult=res.data.data;
this.productResult.length=3;
}elseif(res.data.code==400){
alert(res.data.message)
}

}.bind(this))
},
//邮箱验证
sendEmail(){
varregEmail=/^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/;
if(this.email==''){
alert("请输入邮箱");
}elseif(!regEmail.test(this.email)){
alert("邮箱格式不正确");
}
}
}
}

以上这篇vue中手机号,邮箱正则验证以及60s发送验证码的实例就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持毛票票。

返回顶部
3162201930
czq8825@qq.com

vue中手机号,邮箱正则验证以及60s发送验证码的实例

热门推荐

随机推荐