微信小程序-短信验证倒计时

项目中向用户发送短信验证码实现短信验证,这个之前在使用阿里云进行短信推送说过,这次说下小程序端前台简单的实现方案。

首先输入电话可以进行校验

  //校验手机号
  isPoneAvailable(str) {
    var myreg = /^[1][3,4,5,7,8][0-9]{9}$/;
    if (!myreg.test(str)) {
      return false;
    } else {
      return true;
    }
  },

如果错误会提示

接着如果电话填写正确点击短信验证后实现到计时

                // 倒计时
                var time = 60
                var inter = setInterval(function () {
                  that.setData({
                    getmsg: "短信验证" + "(" + time + "s" + ")",
                    flag: false,
                    flag2: true,
                  })
                  time--
                  if (time < 0) {
                    clearInterval(inter)
                    that.setData({
                      getmsg: "短信验证",
                      flag: true,
                      flag2: false,
                    })
                  }
                }, 1000)

可以设置个提示

效果如图

上面就是小程序端简单实现,有兴趣的朋友可以简单试试噢。

水平有限,若有问题请留言交流!

互相学习,共同进步:) 转载请注明出处谢谢!

猜你喜欢

转载自my.oschina.net/hp2017/blog/1813560