vue 倒计时60s 案例判断与验证码判断

		 getCode(formData){
            if (!this.timer) {
                this.count = TIME_COUNT;
                this.show = false;
                this.timer = setInterval(() => {
                  if (this.count > 0 && this.count <= TIME_COUNT) {
                    this.count--;
                  } else {
                    this.show = true;
                    clearInterval(this.timer);
                    this.timer = null;
                  }
                }, 1000)
              }
        } 

//逻辑判断

    const TIME_COUNT = 60;

                code:"",
                show: true,
                count: '',
                timer: null,

			<button @click="getCode(formData)" class="getCode" :disabled="!show" :class="{count:!show}" >
		         <span v-show="show">获取验证码</span>
		         <span v-show="!show" >{{count}} s</span>
		     </button>

https://blog.csdn.net/Zhooson/article/details/75228666

		getCode(formData){  //获取验证码
		 	if(this.phone==''){
		 		alert("请输入手机号");
		 	}else {
		 	//---------
            if (!this.timer) {
                this.count = TIME_COUNT;
                this.show = false;
                this.timer = setInterval(() => {
                  if (this.count > 0 && this.count <= TIME_COUNT) {
                    this.count--;
                  } else {
                    this.show = true;
                    clearInterval(this.timer);
                    this.timer = null;
                  }
                }, 1000)
              }
//----------------------判断---------------------------------
//--------------------------ajax---------------------------
			var jsonStr = JSON.stringify({"phone":this.phone});
			var token = md5(jsonStr + timestamp)+timestamp;	
			this.$http.post(url+"Login/getSMS",{jsonStr:jsonStr,token:token},{emulateJSON: true}).then((response)=>{
			response=response.body;
			if(response.status==false){
				alert(response.message);
			}else {
				console.log("成功");
			}
						  },
			(error)=>{
				console.log("error");
			}
				);	
//--------------------------ajax---------------------------		 		
		 		}
        },
        next(){  //成功验证后
        if(this.phone==''){
        	alert("请输入手机号");
        }else if(this.code==''){
        	alert("请输入验证码");
        }else {
//--------------------------ajax---------------------------
		var jsonStr = JSON.stringify({"code":this.code,"phone":this.phone});
		var token = md5(jsonStr + timestamp)+timestamp;	
		this.$http.post(url+"Login/cation_code",{jsonStr:jsonStr,token:token},{emulateJSON: true}).then((response)=>{
		response=response.body;
		console.log(response);
		if(response.status==false){
			alert(response.message);
		}else {
			this.fold=true;
		}
					  },
		(error)=>{
			console.log("error");
				 }
			);	
//--------------------------ajax---------------------------
    		}		
        		},

猜你喜欢

转载自blog.csdn.net/qq_38674970/article/details/81508806