線上直播系統原始碼,使用者登入時獲取到使用者已有的賬號資訊

zhibo系統開發發表於2022-06-06

線上直播系統原始碼,使用者登入時獲取到使用者已有的賬號資訊

1、使用者未授權(首次登入)

button open-type='getUserInfo'

2、使用者已經授權(再次登入)

wx.getUserInfo

 html檔案:

<view class="indexContainer">
    <image wx:if='{{userInfo.avatarUrl}}' class="avatarUrl"  src="{{userInfo.avatarUrl}}"></image>
    <button wx:else bindgetuserinfo='handleGetUserInfo' open-type="getUserInfo">獲取使用者資訊</button>
    <text class="userName">{{userInfo.nickName}}</text>
    <!-- 測試事件繫結 -->
  <!-- <view class="goStudy" catchtap="handleParent">
    <text catchtap="handleChild">Hello World</text>
  </view> -->
 
  <view class="goStudy" catchtap="toLogs">
    <text >Hello World</text>
  </view>
</view>


css檔案:

.indexContainer{
  display: flex;
  flex-direction:column;
  align-items: center;
  justify-content: center;
}
 
.avatarUrl{
  width: 200rpx;
  height: 200rpx;
  border-radius: 50%;
  margin:100rpx 0;
}
 
button{
  width: 200rpx;
  height: 200rpx;
  border-radius: 50%;
  margin: 100px 0;
  font-size: 24rpx;
  line-height: 200rpx;
  text-align: center;
  background-color: skyblue;
}
.userName{
  font-size: 32rpx;
  margin: 100rpx 0;
}
.goStudy{
  width: 300rpx;
  height: 80rpx;
  line-height: 80rpx;
  text-align: center;
  font-size: 28rpx;
  border: 1rpx solid #333;
  border-radius: 10rpx;
}

js檔案:

Page({
 
  /**
   * 頁面的初始資料
   */
  data: {
     msg:'初始化資料',
     userInfo:{}   //存放使用者的基本資訊
  },
 
},
 
 
  /**
   * 生命週期函式--監聽頁面載入  頁面載入就會執行
   */
  onLoad: function (options) {
     //修改msg資料  語法  this.setData()  this代表當前頁面的例項物件
    // console.log(this.data.msg)
    //  this.setData({
    //    msg:'修改之後的資料'
    //  })
     //console.log(this.data.msg)
     //授權以後獲取使用者的資訊
     wx.getUserInfo({
       success:(res)=>{
         console.log(res);
         this.setData({
           userInfo:res.userInfo
         })
 
       },
       fail:(err)=>{
          console.log(err)
       }
     })
  },
  //獲取使用者資訊的回撥
  handleGetUserInfo(res){
    console.log(res)
    if(res.detail.userInfo){  //允許修改userinfo的資料
      this.setData({
        userInfo:res.detail.userInfo
      })
    }
  },

以上就是 線上直播系統原始碼,使用者登入時獲取到使用者已有的賬號資訊,更多內容歡迎關注之後的文章


來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/69978258/viewspace-2898928/,如需轉載,請註明出處,否則將追究法律責任。

相關文章