小程序-倒计时

来源:互联网 发布:大数据 曾是规划 编辑:程序博客网 时间:2024/06/06 06:46

这里写图片描述

index.js

// pages/sendCode/index.jsPage({  /**   * 需要指定换行的地方\n(不加不影响垂直居中)   */  data: {    yzm: '发送 ',    yzmDisabled: false,  },  getYzm: function () {    var self = this;    self.changeYzm();  },  changeYzm: function () {    var self = this;    var n = 10;    self.setData({      //禁用button      yzmDisabled: true,      yzm: n ,    })    var yzmInterval = setInterval(function () {      if (self.data.yzm <= 0) {        self.setData({          yzm: '发送',          yzmDisabled: false,        })        clearInterval(yzmInterval);      } else {        n = n - 1;        self.setData({          yzm: n  ,        })      }    }, 1000)  }})

index.wxml

<button class="btn_yzm" catchtap="getYzm" disabled="{{yzmDisabled}}"><text>{{yzm}}</text></button>

index.wxss

.btn_yzm {  font-size: 28rpx;  color: #666666;  border: 2rpx solid #e3e3e3;  background-color: #fff;  border-radius: 12rpx;  padding: 0px;  height: 80rpx;  width: 160rpx;  line-height: 30rpx;  display: table;}.btn_yzm text {  vertical-align: middle;  display: table-cell;}
原创粉丝点击