E企盈营销工具技术服务商 热线:4006-838-530

微信观塘区E企盈小程序小程序获取手机验证码

E企盈直播平台营销卖货系统

一种比较常见的功能获取手机验证码先看效果图:其实这个功能实现起来很简单,主要就是调取第三方接口,拿到返回值验证的问题直接上代码吧:view class='changeInfo'  view class='changeInfoName'     input placeholder='请输入姓名' bindinput='getNameValue' value='{{name}}'/   /view    view class='changeInfoName'     input placeholder='请输入手机号' bindinput='getPhoneValue' value='{{phone}}'/   /view  view class='changeInfoName'     input placeholder='请输验证码' bindinput='getCodeValue' value='{{code}}' style='width:70%;'/      button class='codeBtn' bindtap='getVerificationCode' disabled='{{disabled}}' {{codename}}/button  /view  button class='changeBtn' bindtap='save'保存/button/view

page{  height: 100%;  width: 100%;  background: linear-gradient(#5681d7, #486ec3);}.changeInfo{  display: flex;  flex-direction: column;  justify-content: space-between;  width: 90%;  margin: 50rpx auto;}.changeInfoName{  position: relative;  height: 80rpx;  width: 100%;  border-radius: 10rpx;  background: #fff;  margin-bottom: 20rpx;  padding-left: 20rpx;  box-sizing: border-box;}.codeBtn{  position: absolute;  right: 0;  top: 0;  color: #bbb;  width: 30%;  font-size: 26rpx;  height: 80rpx;  line-height: 80rpx;}.changeInfoName input{  width: 100%;  height:100%;}.changeBtn{  width: 40%;  height: 100rpx;  background: #fff;  color: #000;  border-radius: 50rpx;  position: absolute;  bottom: 10%;  left: 50%;  margin-left: -20%;  line-height: 100rpx;}

var app = require('../../resource/js/util.js');Page({  /**   * 页面的初始数据   */  data: {    name:'',//姓名    phone:'',//手机号    code:'',//验证码    iscode:null,//用于存放验证码接口里获取到的code    codename:'获取验证码'  },  //获取input输入框的值  getNameValue:function(e){    this.setData({      name:e.detail.value    })  },  getPhoneValue:function(e){    this.setData({      phone:e.detail.value    })  },  getCodeValue: function (e) {    this.setData({      code: e.detail.value    })  },  getCode:function(){    var a = this.data.phone;    var _this = this;    var myreg = /^(14[0-9]|13[0-9]|15[0-9]|17[0-9]|18[0-9])d{8}$$/;    if (this.data.phone == "") {      wx.showToast({        title: '手机号不能为空',        icon: 'none',        duration: 1000      })      return false;    } else if (!myreg.test(this.data.phone)) {      wx.showToast({        title: '请输入正确的手机号',        icon: 'none',        duration: 1000      })      return false;    }else{      wx.request({        data: {},        'url': 接口地址,        success(res) {          console.log(res.data.data)          _this.setData({            iscode: res.data.data          })          var num = 61;          var timer = setInterval(function () {            num--;            if (num = 0) {              clearInterval(timer);              _this.setData({                codename: '重新发送',                disabled: false              })            } else {              _this.setData({                codename: num + "s"              })            }          }, 1000)        }      })          }          },  //获取验证码  getVerificationCode() {    this.getCode();    var _this = this    _this.setData({      disabled: true    })  },  //提交表单信息  save:function(){    var myreg = /^(14[0-9]|13[0-9]|15[0-9]|17[0-9]|18[0-9])d{8}$$/;    if(this.data.name == ""开通眼镜片小程序电话:4006-838-530){      wx.showToast({        title: '姓名不能为空',        icon: 'none',        duration: 1000      })      return false;    }    if(this.data.phone == ""){      wx.showToast({        title: '手机号不能为空',        icon: 'none',        duration: 1000      })      return false;    }else if(!myreg.test(this.data.phone)){      wx.showToast({        title: '请输入正确的手机号',        icon: 'none',        duration: 1000      })      return false;    }    if(this.data.code == ""){      wx.showToast({        title: '验证码不能为空',        icon: 'none',        duration:开通羽毛球小程序电话:4006-838-530 1000      })      return false;    }else if(this.data.code != this.data.iscode){      wx.showToast({        title: '验证码错误',        icon: 'none',        duration: 1000      })      return false;    }else{      wx.setStorageSync('name', this.data.name);      wx.setStorageSync('phone', this.data.phone);      wx.redirectTo({        url: '../add/add',      })    }  },  /**   * 生命周期函数--监听页面加载   */  onLoad: function (options) {      },  /**   * 生命周期函数--监听页面初次渲染完成   */  onReady: function () {    },  /**   * 生命周期函数--监听页面显示   */  onShow: function () {    },  /**   * 生命周期函数--监听页面隐藏   */  onHide: function () {    },  /**   * 生命周期函数--监听页面卸载   */  onUnload: function () {    },  /**   * 页面相关事件处理函数--监听用户下拉动作   */  onPullDownRefresh: function开通水草小程序电话:4006-838-530 () {    },  /**   * 页面上拉触底事件的处理函数   */  onReachBottom: function () {    },  /**   * 用户点击右上角分享   */  onShareAppMessage: function () {    }})

想要获得更多资料的  请微信搜索公众号 【热血科技】,关注一下即可。

赞(0) 打赏
未经允许不得转载:E企盈小程序开发-热线:4006-838-530 » 微信观塘区E企盈小程序小程序获取手机验证码
分享到: 更多 (0)
E企盈小程序直播营销卖货系统
E企盈直播平台营销卖货系统

评论 抢沙发

E企盈小程序开发

联系我们联系我们

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏