欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

微信小程序?qū)崿F(xiàn)登錄頁(yè)面

 更新時(shí)間：2022年05月22日 07:03:46   作者：JYeontu  
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)登錄頁(yè)面，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下

本文實(shí)例為大家分享了微信小程序?qū)崿F(xiàn)登錄頁(yè)面的具體代碼，供大家參考，具體內(nèi)容如下

實(shí)現(xiàn)在進(jìn)入微信小程序首頁(yè)前的登錄驗(yàn)證頁(yè)面，這里有兩種方法，但其實(shí)原理都是一樣的。

1. 在首頁(yè)中加入一個(gè)彈窗作為登錄窗口，效果如下圖：

(1)index.wxml

登錄窗口代碼如下：

<view class="modal-mask" bindtap="hideModal" catchtouchmove="preventTouchMove" wx:if="{{!hiddenmodalput}}"></view>
<view class="modal-dialog" wx:if="{{!hiddenmodalput}}" catchtouchmove="preventTouchMove">
? <view class="modal-title">{{tip}}</view>
? <view class="modal-content">
? ? <view class="modal-input">
? ? ? <input placeholder-class="input-holder" type="text" maxlength="20" bindinput="inputUsername" class="input" placeholder="用戶名" value="{{username}}">
? ? ? </input>
? ? </view>
? ? <view class="modal-input">
? ? ? <input placeholder-class="input-holder" type="text" maxlength="20" bindinput="inputPassword" class="input" placeholder="密碼" value="{{password}}">
? ? ? </input>
? ? </view>
? </view>
? <view class="modal-footer">
? ? <navigator class="btn-cancel" target="miniProgram" open-type="exit">
? ? ? 退出
? ? </navigator>
? ? <!-- <view class="btn-cancel" bindtap="cancel" data-status="cancel">取消</view> -->
? ? <view class="btn-confirm" bindtap="confirm" data-status="confirm">確定</view>
? </view>
</view>

(2)index.js

在onload方法中判斷當(dāng)前的登錄狀態(tài)，這里我用了簡(jiǎn)單的 getStorage 來(lái)保存登錄信息，hiddenmodalput控制登錄窗口是否顯示，這樣就可以實(shí)現(xiàn)簡(jiǎn)單的登錄頁(yè)面，hideTabBar是用來(lái)隱藏底部tab欄按鍵。

? /**
? ?* 生命周期函數(shù)--監(jiān)聽(tīng)頁(yè)面加載
? ?*/
? onLoad: function (options) {
? ? let that = this;
? ? wx.getStorage({
? ? ? key: 'username',
? ? ? success (res) {
? ? ? ? console.log(res.data);
? ? ? ? that.setData({
? ? ? ? ? hiddenmodalput:true,
? ? ? ? })
? ? ? },
? ? ? fail (res) {
? ? ? ? console.log(res);
? ? ? ? that.setData({
? ? ? ? ? hiddenmodalput:false,
? ? ? ? })
? ? ? ? wx.hideTabBar({
? ? ? ? ? animation: true,
? ? ? ? ? success: (res) => {},
? ? ? ? ? fail: (res) => {},
? ? ? ? ? complete: (res) => {},
? ? ? ? })
? ? ? }
? ? })
? },

2.新建一個(gè)登錄頁(yè)面

（1）在首頁(yè)onload中進(jìn)行登錄轉(zhuǎn)態(tài)驗(yàn)證，如果為未登錄狀態(tài)，則可以使用wx.navigateTo跳轉(zhuǎn)到登錄頁(yè)面

（2）在登錄頁(yè)面中處理登錄的相關(guān)邏輯，也可以實(shí)現(xiàn)相同的效果。

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

相關(guān)文章

最新評(píng)論