登录的流程

1.点击登录

2.进行预校验

3.发起post请求

4..then.catch拿到成功或者失败的结果

<template>
<span>{{timerCount>0?`${timerCount}秒`:"发送验证码"}}  @click="sendCode"发送验证码</span>
<button @click="login">登录</button>
 </template>
<script>
data(){
    return {
        mobile:'',
        code:'',
        timerCount:0 //倒计时默认为0
    }
}
methods:{
    login(){
    const mobileReg = /^1[3-9]\d{9}$/;
    const codeReg = /^d{6}$/;
    if(mobileReg.test(this.mobile)&&         codeReg.test(this.code)){
        //此时说明了两个都通过了校验,发起post请求
        axios.post('http://.......',{
            mobile:this.mobile,
            code:this.code
        }).then(()=>{
            //成功登陆的操作
        }).catch(()=>{
            //登录失败的操作
        })
    }else{
        alert("手机号或者验证码格式不对")
    }
}
    sendCode(){
        //判断当前倒计时事件>0不能发送
        const mobileReg = /^1[3-9]\d{9}$/;
        if(this.timerCount === 0 && mobileReg.test(this.mobile)){
            //等于0的情况下,并且手机号符合规范的情况下才能 发送验证码
          axios.get(`https//..../${this.mobile}`);
            this.timerCount = 60 //开启定时器
            this.timer = setInterval(()=>{
                if(this.timerCount==0){
                    clearInterval(this.timer) //此时倒计时结束
                }else{
                     this.timerCount--
                }  
            },1000)
        }
    }
}
</script>