找回密码
 立即注册

QQ登录

只需一步,快速开始

搜索本站精品资源

首页 教程频道 小程序开发 查看内容

微信小程序开发-短信注册功能

作者:模板之家 2017-11-28 17:29 8845人关注

微信小程序开发,实现手机号注册的功能模块,去除了网络请求,网络请求的地方可以使用wx提供的网络请求的API完成。[效果展示][目录结构][贴代码]register.wxmlview class=contai

微信小程序开发,实现手机号注册的功能模块,去除了网络请求,网络请求的地方可以使用wx提供的网络请求的API完成。[效果展示][目录结构][贴代码]register.wxmlview class="contai ...

 
 
 

微信小程序开发,实现手机号注册的功能模块,去除了网络请求,网络请求的地方可以使用wx提供的网络请求的API完成。 
 

[效果展示]

 

[目录结构]

 

[贴代码]

register.wxml

 

[html] view plain copy
 
  1. <view class="container" style="height: {{windowHeight}}px">  
  2.     <!--第一步-->  
  3.     <view wx:if="{{step == 1}}" id="firstStep_Pad" class="container" style="height:auto;">  
  4.         <text class="grayLineHeng" style="margin-top:55rpx" />  
  5.         <view style="width:{{windowWidth}}px;" class="container-hang">  
  6.             <text style="color:#c9c9c9;margin:33rpx 0 33rpx 0; width:460rpx;text-align:center;">国家/地区</text>  
  7.             <text class="grayLineShu" style="height:auto"></text>  
  8.             <text style="color:#000;width:100%;text-align: center;margin-top:33rpx">{{location}}</text>  
  9.         </view>  
  10.         <text class="grayLineHeng" />  
  11.         <view class="container-hang" style="width:{{windowWidth}}px;">  
  12.             <image src="{{icon_phone}}" style="width:49rpx; height: 49rpx; margin:28rpx"/>  
  13.             <input id="input_phoneNum" bindchange="input_phoneNum" style="margin:24rpx 32rpx 0 0;height:49rpx;" placeholder="请输入电话号码" type="number"/>  
  14.         </view>  
  15.         <text class="grayLineHeng" />  
  16.     </view>  
  17.       
  18.     <!--第二步-->  
  19.     <view wx:if="{{step==2}}" id="secondStep_Pad" class="container" style="height:auto;align-items:flex-start;">  
  20.         <text style="margin:44rpx; font-size:30rpx">验证码已经发送到您的手机\n如长时间没有收到,请点击“重新获取”</text>  
  21.         <text class="grayLineHeng" />  
  22.         <view class="container-hang" style="width:{{windowWidth}}px;">  
  23.             <image src="{{input_icon}}" style="width:49rpx; height: 49rpx; margin:28rpx"/>  
  24.             <input bindchange="input_identifyCode" style="margin:24rpx 32rpx 0 0;height:49rpx;" placeholder="请输入验证码" type="number"/>  
  25.         </view>  
  26.         <text class="grayLineHeng" />  
  27.   
  28.         <button bindtap="reSendPhoneNum" size="mini" style="margin-top:23rpx;margin-right:23rpx">重新获取({{time}}s)</button>  
  29.     </view>  
  30.   
  31.     <!--第三步-->  
  32.     <view wx:if="{{step==3}}" id="thirdStep_Pad" class="container" style="height:auto;margin-top:23rpx">  
  33.         <text class="grayLineHeng" />  
  34.         <view 邀请

路过

雷人

握手

鲜花

鸡蛋
原作者: 模板之家 来自: 网络收集

全部回复(0)