微信小程式之獲取使用者資訊介面優化調整
阿新 • • 發佈:2019-01-03
突然收到這個訊息的我是懵逼的,因為這意味著我要改需求!
新的處理方式就是
我的做法是做一個緩衝載入頁,然後通過wx.getUserInfo獲取使用者資訊,如果已經授權過了,那麼是可以獲取資訊的
如果沒有授權過,則出現button,然後再獲取使用者資訊
基於weui,getUserInfo請參考連結微信小程式至wx.getUserInfo與wx.login介面應用分享
loading.js
var app=getApp() Page({ data:{ loading:true, }, onLoad: function () { var that = this; app.getUserInfo(function(){ app.toIndex()//載入成功 },function(){ that.setData({loading:false})//載入失敗 }); }, login:function(e){ app.globalData.userInfo = e.detail.userInfo; console.log('使用者資訊', app.globalData.userInfo); wx.login({ success: function (res) { var code = res.code; app.login(code, e.detail, function () { app.toIndex() }); } }) } })
loading.wxml
<view class="page"> <view class="loading_tip "> <view class="classname">為體育賽事提供線上解決方案</view> <button open-type="getUserInfo" type='primary' bindgetuserinfo="login" hidden='{{loading}}'>點此登入</button> <view class="weui-loadmore" hidden='{{!loading}}'> <view class="weui-loading"></view> <view class="weui-loadmore__tips">啟動中</view> </view> </view> <view class="page__bd page__bd_spacing"> <view class="weui-footer weui-footer_fixed-bottom"> <view class="weui-footer__links"> <view class="weui-footer__link">賽事通</view> </view> <view class="weui-footer__text">Copyright © 2018</view> </view> </view> </view>
loading.wxss
.loading_tip{
position: fixed;
height: 100%;
width: 100%;
display:flex;
flex-direction:column;
align-items:center;
justify-content: center;
font-size: 1rem
}