微信登录

àì夳堔傛蜴生んèń 2023-07-19 05:49 35阅读 0赞

Page({ 
    
      /** * 页面的初始数据 */
      data: { 
        canIUse: wx.canIUse('button.open-type.getUserInfo'),
        imgUrl:'',
        uname:''
      },
      onLoad: function () { 
       
      },
      bindGetUserInfo(e) { 
        console.log(e.detail.userInfo);
        var that = this;
        // 查看是否授权
        wx.getSetting({ 
          success(res) { 
            if (res.authSetting['scope.userInfo']) { 
              // 已经授权，可以直接调用 getUserInfo 获取头像昵称
              wx.getUserInfo({ 
                success: function (res) { 
                  console.log(res.userInfo.avatarUrl)
                  wx.setStorageSync("imgUrl",res.userInfo.avatarUrl);
                  that.setData({ 
                    imgUrl: res.userInfo.avatarUrl,
                    uname: res.userInfo.nickName
                  })
                  // console.log(wx.getStorageSync('imgUrl'))
                }
              }) 
            }
          }
        })
      },
    
      /** * 生命周期函数--监听页面初次渲染完成 */
      onReady: function () { 
        
      },
    
      /** * 生命周期函数--监听页面显示 */
      onShow: function () { 
        
      },
    
      /** * 生命周期函数--监听页面隐藏 */
      onHide: function () { 
        
      },
    
      /** * 生命周期函数--监听页面卸载 */
      onUnload: function () { 
        
      },
    
      /** * 页面相关事件处理函数--监听用户下拉动作 */
      onPullDownRefresh: function () { 
        
      },
    
      /** * 页面上拉触底事件的处理函数 */
      onReachBottom: function () { 
        
      },
    
      /** * 用户点击右上角分享 */
      onShareAppMessage: function () { 
        
      }
    })

<image src="{ {imgUrl}}" class="tou"></image>
    <text class="uname">{ { uname}}</text>
    
    <button wx:if="{ {!imgUrl}}" open-type="getUserInfo" bindgetuserinfo="bindGetUserInfo">授权登录</button>