美文网首页
支付宝小程序

支付宝小程序

作者: 曹锦花 | 来源:发表于2020-02-22 13:13 被阅读0次

事件: onBlur (失去焦点) onTap(点击事件) onChange(当数据发送改变的时候触发的事件) onFocus(聚焦)onInput

//判断添加.blue还是.white样式
class="left {{pass=='#0B94DE'?'blue':'white'}}"
//点击事件changeTap的参数写在data-num里
data-num="2" onTap="changeTap" 
//js中获取传入的参数
e.target.targetDataset.num
//给data中的变量重新赋值
this.setData({pass:"#0B94DE"})
//相当于vue中的v-if (配合a:elif   a:else )
 a:if="{{pass=='#0B94DE'}}"

//提示信息
my.showToast({ content: "请输入正确的手机号" });

登录接口请求

//登录接口请求
  login() {
    var data = {
      loginName: this.data.loginName,
      password: this.data.password,
      sn: my.getStorageSync({ key: 'sn' }).data,
      loginType: 1,
      type: 4
    }
    var str = `${JSON.stringify(data)}${timestamp}${signkey}`
    var sign = hexMD5(str);
    my.request({
      url: `${url}/term/device/login?appid=web.2019&appver=81&format=json&timestamp=${timestamp}&version=1.0&sign=${sign}&token=12`,
      method: 'POST',
      data: data,
      // 期望返回的数据格式,默认json,支持json,text,base64
      dataType: 'json',
      // 调用成功的回调函数
      success: (res => {
        console.log(res)
        if (res.data.success == 1) {
        } else {
        }
      }),
      // 调用失败的回调函数
      fail: function(res) {
        console.log(res)
      }
    });
  }

获取验证码60s倒计时

  //获取验证码 设置变量countDown、 sendDisabled
  getcode() {
    var filterphone = /^1\d{10}$/;
    if (!filterphone.test(this.data.loginName)) {
      my.showToast({ content: "请输入正确的手机号" });
    }else {
      var clock = "";
      var nums = 60;
      //将按钮置为不可点击
      this.setData({
        sendDisabled: true
      })
      this.data.countDown = nums + "s";
      var doLoop = () => {
        nums--;
        if (nums > 0) {
          this.setData({
            countDown: nums + "s"
          })
        } else {
          clearInterval(clock); //清除js定时器

          this.setData({
            countDown: "获取验证码",
            sendDisabled: false

          })
          nums = 60; //重置时间
        }
      }
      clock = setInterval(doLoop, 1000); //一秒执行一次
     //请求获取验证码的接口
    }
  }

相关文章

网友评论

      本文标题:支付宝小程序

      本文链接:https://www.haomeiwen.com/subject/wgrlqhtx.html