vantui+vue写移动端项目练手（下）

最新推荐文章于 2024-04-04 17:22:42 发布

喔烨鸭

最新推荐文章于 2024-04-04 17:22:42 发布

阅读量250

点赞数

文章标签：短信验证前端开发后端逻辑验证码比对倒计时

本文链接：https://blog.csdn.net/qq_45432996/article/details/116454112

版权

短信登录用到的函数：
在这里插入图片描述
短信验证逻辑：点击发送验证码会向后端发送请求由后端处理，后端将生成的验证码以及手机号码对应的存储起来，用户提交验证码后，后端进行比对验证

timesetdjs(){
      if(this.value == ""){  //判断手机号码是否输入
        return
      }
      var currentTime = 60
      this.disabled = true;  //发送验证码按钮禁止一分钟内重复点击
      var that = this;
      var interval = setInterval(function () {
        that.showmsg = (currentTime - 1) + 's'  //倒计时时间
        currentTime--;
        if (currentTime < 0) {
          clearInterval(interval);//清除计时器
          that.disabled = false  //60s后恢复点击
          that.showmsg = "发送验证码"
          currentTime = 60
        }
      },1000)
    },

随机获取一个四位数：

suijiCode(){
      // 获取一个[0,1) 的随机数
			var randomNum = Math.random()
		  //获取一个固定的4位数 
			var checkCode = randomNum*9000
				checkCode +=1000;
			return parseInt(checkCode)
    },