微信小程序登录

login.wxml 

<view class="content">
    <!--用户名-->
    <view class="username">
    <view class="title">用户名:</view>
    <view class="useid">
       <!--输入事件  bindinput-->
      <input type="text" name="username" bindinput="usernameInput" placeholder="用户名/邮箱/手机号" placeholder-style="color:#999"/>
    </view>
    </view>
    <!--分割线-->
    <view class="hr"></view>
    <!--密码-->
    <view class="username">
    <view class="title">密码:</view>
    <view class="useid">
      <input type="text" name="password" bindinput="passwordInput" placeholder="请输入密码" placeholder-style="color:#999" type="password"/>
    </view>
    </view>
    <!--登录按钮-->
    <button type="primary" class="loginBtn" disabled="{{loginBtnState}}" bindtap="login">登录</button>
    <!--注册导航-->
    <view class="register">
        <view>
           <navigator open-type="navigate" url="/pages/iphone/iphone">
             手机号快速注册
           </navigator>
        </view>
        <view>
           <navigator open-type="navigate" url="/pages/com/com">
           企业用户注册
           </navigator>
        </view>
        <view>
          找回密码
        </view>
    </view>
</view>

login.ts

Page({
  /**
   * 页面的初始数据
   */
  data: {
      loginBtnState:true,   //登录按钮  灰色不可用
      username:"",
      password:""
  },
  //用户名输入事件
  usernameInput:function(e){
      //console.log(e);
      var val = e.detail.value;
      if (val != ''){
         this.setData({
           username:val
         });
         //console.log(this.data.password);
         if(this.data.password !=""){
           this.setData({
            loginBtnState:false
           })
         }
      }else{
        this.setData({
          loginBtnState:true
        })
      }
  },
  //密码输入事件
  passwordInput:function(e){
     var val = e.detail.value;
     if(val != ''){
       this.setData({
         password:val
       });
       //console.log(this.data.username);
       if(this.data.username !=""){
         this.setData({
           loginBtnState:false
         })
       }
     }else{
      this.setData({
        loginBtnState:true
      })
    }
  },
  //登录
  login:function(){
      var userInfs = wx.getStorageInfoSync('userobjs') || [];
      //var userInf = userInfs.find(item=>{
      //  item.username==this.data.username;
      //});
      if(true){//userInf
        //if(userInfs.password==this.data.password){
          if(true){
          wx.showToast({
            title:'登录成功',
            duration:2000,
            success:function(){
              wx.navigateTo({
                url:'../home/home',
              })
            }
          })
        }else{
          wx.showToast({
            title:'密码不正确!',
            duration:2000
          })
        }
      }else{
        wx.showToast({
          title:'用户名没找到!',
          duration:2000
        })
      }
  },

===========================================================

小程序手机快速注册

iphone.wxml

<!--pages/iphone/iphone.wxml-->
<view class="iphonebg">
    <view>+86</view>
    <view>
       <input type="text" placeholder="请输入手机号" maxlength="11" bindinput="iphoneInput"/>
    </view>
</view>
<!--同意协议-->
<view>
   <view class="protocol">
       <icon type="success" color="red" size="18"></icon>
       <text class="agree">同意</text>
       <text class="optoins">用户注册协议</text>
   </view>
</view>
<!--下一步按钮-->
<button class="nextStepBtn" type="primary" disabled="{{nextStepBtnState}}" bindtap="nextStep" style="width:90%">下一步</button>

iphone.ts

Page({

  /**
   * 页面的初始数据
   */
  data: {
    nextStepBtnState:true,
    iphone:""
  },
  iphoneInput:function(e){
      var val = e.detail.value;
      if(val !=""){
        this.setData({
          nextStepBtnState:false,
          iphone:val
        })
      }else{
        this.setData({
          nextStepBtnState:true,
          iphone:""
        })
      }
  },
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad() {
    wx.setNavigationBarTitle({  //页面头部标题
      title:'手机号快速注册',
    })
  },

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值