chao202426

基于vue来实现的

html部分

<div class="get-code" @click.stop="getCode">{{codeTxt}}</div>

js部分

export default {
    data(){
        isCodeIng:false,//是否倒计时
        codeTxt:\'获取验证码\',
    },
    methods:{
        getCode(){
            if(!this.isCodeIng){
                //获取验证码倒计时
                this.isCodeIng = true;
                let time = 60;
                let timer = setInterval(()=> {
                     time--;
                     this.codeTxt = \'重新获取\'+ time + \'s\';
                     if (time <= 0) {
                          this.codeTxt = \'获取验证码\';
                          this.isCodeIng = false;
                          clearInterval(timer);
                     }
                 }, 1000);
            }
        }
    }    
}
        

自己预留起来,以后用到可以直接使用

分类:

技术点:

相关文章: