1、点击登录

点击获取验证码校验

点击获取验证码后的倒计时可采用vant Weapp框架里的CountDown倒计时组件

    // 引入组件
    "usingComponents": {
      "van-count-down": "@vant/weapp/count-down/index"
    }
   
   // 设置全局变量存储验证码
    let securet_code = ''
    let app = getApp()
    Page({
      data: {
        countDownVisible: true,
        mobile: '',
        code: ''
      },

      // 点击获取验证码
      async getCode() {
        if (!this.varifyMobile()) return
        const mobile = this.data.mobile;
        const yzm = await wx.http.get('/code', {
          mobile
        })
        if (yzm.code !== 10000) return wx.utils.toast('发送失败，请稍后再试~')
        wx.utils.toast('验证码获取成功')
        this.setData({
          countDownVisible: true,
          code: yzm.data.code
        })
        securet_code = yzm.data.code
        console.log(securet_code);
      },
      // 封装校验手机号的方法
      varifyMobile() {
        const reg = /^1[3-9]\d{9}$/
        const mobile = this.data.mobile.trim()
        const varify = reg.test(mobile)
        if (!varify) return wx.utils.toast('手机号格式不正确')
        return varify
      },
      // 校验验证码
      varifyCode() {
        const reg = /^\d{6}$/       // 验证码为6位数字
        const valid = reg.test(securet_code.trim())
        if (!valid) {
          wx.utils.toast('验证码不正确')
        }
        return valid
      },
      // 点击获取验证码
      copyCode() {
        wx.setClipboardData({
          data: securet_code
        })
      },
      // 点击登录
      async login() {
        if (!this.varifyMobile()) return
        if (!this.varifyCode()) return

        const {
          mobile,
          code
        } = this.data
        const res = await wx.http.post('/login', {
          mobile,
          code
        })
        console.log(res);
        wx.utils.toast('可以发送请求了')
        if (res.code !== 10000) return wx.utils.toast('恭喜你，登录失败')
        const token = `Bearer ${res.data.token}`
        wx.setStorageSync('token', token)
        app.token = token
      },
      // 倒计时处理
      countDownChange(ev) {
        this.setData({
          timeData: ev.detail,
          countDownVisible: ev.detail.minutes === 1 || ev.detail.seconds > 0,
        })
      }
    })