页面上
<button class="code" (click)="getCode()" [disabled]="!verifyCode.disable">{{verifyCode.verifyCodeTips}}</button> //getCode()为点击按钮运行的方法
ts中
//验证码倒计时 全局定义变量 verifyCode: any ={ verifyCodeTips: "获取验证码", countdown: 60,//总共时间 disable: true }; //获取验证码的方法 getCode(){ //每次点击时初始化 this.verifyCode = { verifyCodeTips: "获取验证码", countdown: 60,//总共时间 disable: true //禁止按钮被点击 } this.settime() } //倒计时 settime() { if(this.verifyCode.countdown == 0) { this.verifyCode.verifyCodeTips = "获取验证码"; this.verifyCode.disable = true; return; } else { this.verifyCode.countdown--; } setTimeout(() => { this.verifyCode.verifyCodeTips = "重新获取" + this.verifyCode.countdown + "秒"; this.settime(); }, 1000); }
具体可参考:https://blog.csdn.net/changzhengcome/article/details/79162333