vue中手机号，邮箱正则验证以及60s发送验证码

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

1.  
   <div>
2.  
   <p class="fl">
3.  
   <input name="phone" type="number" placeholder="手机号" v-model="phone"/>
4.  
   <button type="button" :disabled="disabled" @click="sendcode" class="btns">{{btntxt}}</button>
5.  
   </p>
6.  
   <p class="fl" style="margin-left: 20px;">
7.  
   <input type="text" placeholder="验证码"/>
8.  
   </p>
9.  
   </div>
10.  
    <input type="button" value="查询" class="btns search" @click="query"/>

这里是script里的内容

1.  
   export default {
2.  
   data: function () {
3.  
   return {
4.  
   disabled:false,
5.  
   time:0,
6.  
   btntxt:"获取验证码",
7.  
   formMess:{
8.  
   email:this.email,
9.  
   phone:this.phone
10.  
    }
11.  
    }
12.  
    },
13.  
    mounted: function () {
14.  
     
15.  
    },
16.  
    methods:{
17.  
    //验证手机号码部分
18.  
    sendcode(){
19.  
    var reg=11 && /^((13|14|15|17|18)[0-9]{1}\d{8})$/;
20.  
    //var url="/nptOfficialWebsite/apply/sendSms?mobile="+this.ruleForm.phone;
21.  
    if(this.phone==''){
22.  
    alert("请输入手机号码");
23.  
    }else if(!reg.test(this.phone)){
24.  
    alert("手机格式不正确");
25.  
    }else{
26.  
    this.time=60;
27.  
    this.disabled=true;
28.  
    this.timer();
29.  
    /*axios.post(url).then(
30.  
    res=>{
31.  
    this.phonedata=res.data;
32.  
    })*/
33.  
    }
34.  
    },
35.  
    timer() {
36.  
    if (this.time > 0) {
37.  
    this.time--;
38.  
    this.btntxt=this.time+"s后重新获取";
39.  
    setTimeout(this.timer, 1000);
40.  
    } else{
41.  
    this.time=0;
42.  
    this.btntxt="获取验证码";
43.  
    this.disabled=false;
44.  
    }
45.  
    },
46.  
    query(){
47.  
    var formMess=this.formMess
48.  
    Axios.post(api+"/order/select/reception", formMess)
49.  
    .then(function (res) {
50.  
    if(res.data.code==200){
51.  
    console.log(res.data.data);
52.  
    this.productResult=res.data.data;
53.  
    this.productResult.length=3;
54.  
    }else if(res.data.code==400){
55.  
    alert(res.data.message)
56.  
    }
57.  
     
58.  
    }.bind(this))
59.  
    },
60.  
    //邮箱验证
61.  
    sendEmail(){
62.  
    var regEmail= /^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/;
63.  
    if(this.email==''){
64.  
    alert("请输入邮箱");
65.  
    }else if(!regEmail.test(this.email)){
66.  
    alert("邮箱格式不正确");
67.  
    }
68.  
    }
69.  
    }
70.  
    }