微信小程序登录及受权相干内容
1. 实现点击受权,受权后显示头像,button 暗藏:
1. 点击 button 取得用户信息,显示头像和昵称
2. 取得用户信息后受权 button 不再显示
3. 开启小程序时,查问是否受权过,受权过了间接显示头像昵称,不显示 button
未受权时
获取信息后
2. 点击 button 取得用户信息
`<button wx:if="{{!hasUserInfo && canIUse}}" open-type="getUserInfo" bindgetuserinfo="onGetuserinfo"> 获取头像昵称 </button>`
open-type=”getUserInfo” 是 button 自带的属性,点击后能够关上受权对话框:
bindgetuserinfo=”onGetuserinfo” 也是 button 自带的事件,文档:
js 局部:
data: {
avatarUrl: './user-unlogin.png',
userInfo: {},
hasUserInfo: false,
canIUse: wx.canIUse('button.open-type.getUserInfo')
},
onGetuserinfo: function(e) {
// e 是
console.log(e);
app.globalData.userInfo = e.detail.userInfo
this.setData({
userInfo: e.detail.userInfo,
hasUserInfo: true
})
},
2. 登录时判断是否受权过,并获取 userinfo
onLoad: function() {
let that = this;
// 能够通过 wx.getSetting 先查问一下用户是否受权了 "scope.record" 这个 scope
wx.getSetting({success(res) {console.log('getsetting', res);
if (res.authSetting['scope.userInfo']) {
// 必须是在用户曾经受权的状况下调用
wx.getUserInfo({success: function(res) {
that.setData({
hasUserInfo: true,
canIUse: true,
userInfo: res.userInfo
})
}
})
}
}
})
},