小程序：登陸頁獲取用戶信息並傳遞用戶數據到我的中心頁

步驟一：我的中心頁添加「當即登陸」按鈕跳轉至登陸頁
1、我的中心頁的me.wxml代碼

<view class="userinfo">
    <button wx:if="{{!hasUserInfo && canIUse}}" bindtap="bindUserLogin"> 當即登陸 </button>
    <block wx:else open-type="getUserInfo">
      <image bindtap="bindViewTap" class="userinfo-avatar" src="{{userInfo.avatarUrl}}" background-size="cover"></image>
      <text class="userinfo-nickname">{{userInfo.nickName}}</text>
    </block>
  </view>

分析

1. 屬性bindtap="bindUserLogin"實現從我的中心跳轉到登錄頁
2. wx:if和wx:else判斷我的中心頁是否獲取到用戶信息，若是有用戶信息，顯示<block>標籤內的內容，不然顯示<button>按鈕

我的中心頁me.wxss代碼

.userinfo {
  width: 100%; 
  display: flex;
  flex-direction: column;
  align-items: center;
}

.userinfo-avatar {
  width: 128rpx;
  height: 128rpx;
  margin: 20rpx;
  border-radius: 50%;
}

.userinfo-nickname {
  color: #aaa;
}

.usermotto {
  width: 100%;
  margin-top: 200rpx;
}

我的中心頁me.js代碼

const app = getApp()
Page({
  data: {
    motto: '',
    userInfo: {},
    hasUserInfo: false,
    canIUse: wx.canIUse('button.open-type.getUserInfo')
  },
  // 事件處理函數：跳轉到登錄頁
  bindUserLogin:function() {
    wx.navigateTo({
      url: '../login/login',
    })
  },
  onLoad: function () {
  },
  // onShow中的代碼做用：在登錄頁獲取到用戶新消息後，我的中西頁進行判斷，有用戶信息就把信息添加到<block>對應的位置，沒有用戶信息就不顯示
  onShow:function() {
    if (app.globalData.userInfo) {
      this.setData({
        userInfo: app.globalData.userInfo,
        hasUserInfo: true
      })
    } else if (this.data.canIUse) {
      app.userInfoReadyCallback = res => {
        this.setData({
          userInfo: res.userInfo,
          hasUserInfo: true
        })
      }
    } else {
      wx.getUserInfo({
        success: res => {
          app.globalData.userInfo = res.userInfo
          this.setData({
            userInfo: res.userInfo,
            hasUserInfo: true
          })
        }
      })
    }
  }
})

步驟二：登陸頁獲取用戶信息並返回我的中心頁
登陸頁loginwxml代碼

<button class='wx-login' open-type="getUserInfo" bindgetuserinfo="getUserInfo">微信受權一鍵登陸</button>
**分析**

 1. bindgetuserinfo="getUserInfo" 對應獲取用戶信息的方法
 2. open-type="getUserInfo" 沒有這個屬性，沒法彈出受權彈窗
 3. 點擊「當即受權一鍵登陸」，會調用getUserInfo方法

當前頁login.js代碼

const app = getApp()
Page({
  data: {
    motto: '發佈',
    // 初始化用戶信息：userInfo hasUserInfo
    userInfo: {},
    hasUserInfo: false,
    canIUse: wx.canIUse('button.open-type.getUserInfo')
  },
  onLoad: function () {
  },
  // 點擊「點擊受權一鍵登陸，調用getUserInfo獲取用戶信息」
  getUserInfo: function (e) {
    app.globalData.userInfo = e.detail.userInfo
    this.setData({
      userInfo: e.detail.userInfo,
      hasUserInfo: true
    })
    // 獲取到用戶信息後，調用wx.navigateBack()返回上一頁，即我的中心頁，wx.navigateBack()必定要在這個位置：
    wx.navigateBack()
  }
})