按钮倒计时

 <el-button  size="default" :loading="codeLoading"  @click="getCode">
                              
                              <span v-show="!codeLoading">获取验证码</span>  
                              <span v-show="codeLoading">{{ countDuwn }}秒后重发</span>
                            </el-button>

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28

getCode(){         //按钮变成加载状态         this.codeLoading=true             // 调用接口           // if (true) {                     //    setTimeout(()=>{         //     // 按钮回复         //     this.codeLoading=false              //   },30000)                     // } else {                     // }           let timer=setInterval(() => {           if (this.countDuwn>0) {             this.countDuwn--           }else {             clearInterval(timer)             this.codeLoading=false             this.countDuwn=60           }         }, 1000);       }

　　

?

1 2 3 4

data() {         return {             codeLoading:false,             countDuwn:60,}