小程序獲取用戶的登錄頭像和用戶名

本案例可加小程序交流群在文件中獲取本例代碼。（找到今日日期就可以找到本文件）。本案例復制有可能會報錯。因為標點有可能報錯。只做參考

WXML:

<view class="page-body-info">
    <image class="userinfo-avatar" src="{{userInfo.avatarUrl}}"></image>
    <text class="userinfo-nickname">{{userInfo.nickName}}</text>
</view>
<view class="btn-area">
  <button type="primary" bindtap="getUserInfo">獲取用戶信息</button>
</view>

WXSS:

.page-body-info {
  padding-bottom: 0;
  height: 230px;
}
.userinfo-avatar {
  border-radius: 128rpx;
  width: 128rpx;
  height: 128rpx;
}
.userinfo-nickname {
  margin-top: 20rpx;
  font-size: 38rpx;
}

JS:

Page({
  data: {
  },
  getUserInfo: function () {
    var that = this
    _getUserInfo();
    function _getUserInfo() {
      wx.getUserInfo({
        success: function (res) {
          that.setData({
            userInfo: res.userInfo
          })
          that.update()
        }
      })
    }
  }
})