微信小程序短信倒计时60秒提醒功能实现

简介: 背景我们是西安卫生局平台项目,给陕西健康卡完成移动App开发后,进军小程序开发问题迁移到登陆验证码获取,需要有倒计时功能,app使用到setTimeout ,出问题了?!死活递归调用不了耗时整整一个早晨的战斗,什么 外部定义方法啊 内部传递变量啊 等等。

背景
我们是西安卫生局平台项目,给陕西健康卡完成移动App开发后,进军小程序开发

问题
迁移到登陆验证码获取,需要有倒计时功能,app使用到setTimeout ,出问题了?!死活递归调用不了
微信小程序短信倒计时60秒提醒功能实现

耗时
整整一个早晨的战斗,什么 外部定义方法啊 内部传递变量啊 等等。。。最后宣告失败

突破
发现了setInterval倒计时,果然好使。成功运行代码如下

    // 60秒后重新获取验证码
    var inter = setInterval(function () {
      this.setData({
        snsCodeMsg: "重新发送(" + this.data.snsMsgWait + ")",
        snsMsgWait: this.data.snsMsgWait - 1
      });
      if (this.data.snsMsgWait < 0) {
        clearInterval(inter)
        this.setData({
          snsCodeMsg: "获取验证码",
          snsMsgWait: 60
        });
      }
    }.bind(this), 1000);

注意后面的bind绑定,最关键。不然又是未定义,无法使用外围的变量。
微信小程序短信倒计时60秒提醒功能实现

最后
请不要放弃,想要的效果总会出现,坚持换个思路。


沫沫金提供,谢谢你的观看。朋友的软件开发都找我,你也可以。请百度搜索我得名字,你可和我一对一讨论技术。

目录
相关文章
|
6月前
|
小程序 JavaScript API
微信小程序扫一扫的功能实现
微信小程序扫一扫的功能实现
327 0
|
7天前
|
移动开发 小程序 安全
使用阿里云短信+微信短链接跳转微信小程序
此内容是关于使用阿里云短信带传递参数的微信短链接跳转到微信小程序。首先,需要准备微信开发者工具和一个已认证的小程序。接着,开通云开发并配置云开发权限。然后,配置H5静态网页,包括设置云开发权限和处理不同设备的跳转方式。最后,上传云函数并修改其权限,获取微信短信链接,配置短链接参数,并开通阿里云短信服务以进行测试验证。整个过程涉及到了微信开发者工具、云开发、H5页面配置、云函数的创建和部署以及阿里云短信服务的开通和使用等步骤。
57 0
|
7天前
|
存储 小程序 前端开发
如何开发微信小程序|基于微信小程序就诊预约系统的设计与实现
如何开发微信小程序|基于微信小程序就诊预约系统的设计与实现
117 0
|
7天前
|
小程序 前端开发 API
微信小程序中微信支付流程
微信小程序中微信支付流程
44 0
|
10月前
|
SQL 小程序 搜索推荐
微信小程序 获取 手机验证码 短信验证码 后端功能实现解析
微信小程序 获取 手机验证码 短信验证码 后端功能实现解析
602 0
微信小程序 获取 手机验证码 短信验证码 后端功能实现解析
|
11月前
|
小程序 安全 JavaScript
微信小程序登录流程与实现
微信小程序登录流程与实现
264 1
|
11月前
|
小程序 Java
记录一次微信小程序支付调试的坑
记录一次微信小程序支付调试的坑
135 0
|
12月前
|
小程序 JavaScript
微信小程序登录与注册验证码倒计时的效果实现
微信小程序登录与注册验证码倒计时的效果实现
260 0
|
小程序
微信小程序获取验证码倒计时60秒案例
微信小程序获取验证码倒计时60秒案例
399 1
微信小程序获取验证码倒计时60秒案例
|
小程序 开发者
【小程序】微信小程序版本更新如何通知用户?
【小程序】微信小程序版本更新如何通知用户?
【小程序】微信小程序版本更新如何通知用户?