wx.getUserInfo：此方法就是微信获取用户信息的方法
image.png
可以在成功的回调函数里面打印以下这个方法的实参，看看里面到底是啥
wx.getUserInfo({
success: res => {
console.log(res)
// 可以将 res 发送给后台解码出 unionId
this.globalData.userInfo = res.userInfo
// 由于 getUserInfo 是网络请求，可能会在 Page.onLoad 之后才返回
// 所以此处加入 callback 以防止这种情况
if (this.userInfoReadyCallback) {
this.userInfoReadyCallback(res)
}
}
})
，这个对象里的数据就是我们用户的信息，这样就算是拿到了这个用户的信息了，接下来就是要把他渲染到页面里去了，这个时候需要在data里面定义一个对象来接受一下赋值，将userInfo的值赋给我们定义好的对象
在小程序中赋值不能直接等于号赋值，而需要通过以下方法
this.setData({
userInfo:res.userInfo
})
这个时候会有一个疑问，如果一个用户已经授权过之后，就不再需要重新弹出授权了，所以需要做一个判断
小程序官方提供了一个方法
wx.getSetting
这个方法同样也有失败和成功的回调函数
wx.getSetting({
success: res => {
console.log(res)
if (res.authSetting['scope.userInfo']) {
// 已经授权，可以直接调用 getUserInfo 获取头像昵称，不会弹框
wx.getUserInfo({
success: res => {
console.log(res)
// 可以将 res 发送给后台解码出 unionId
this.globalData.userInfo = res.userInfo
// 由于 getUserInfo 是网络请求，可能会在 Page.onLoad 之后才返回
// 所以此处加入 callback 以防止这种情况
if (this.userInfoReadyCallback) {
this.userInfoReadyCallback(res)
this.setData({
userInfo:res.userInfo
})
}
}
})
}
}
})
同样，也打印以下这个成功的回调函数里的res，看看里面有什么
image.png
可以看到authSetting里面有一个属性叫scope.userInfo，他的值为true，这个属性就是来判断用户是否授权的
接下来只需要在wx.getSetting方法里加一个判断，如果scope.userInfo的值为true，就不再执行获取用户信息的方法。
image.png
可以看到，这里scope.userInfo是一个不规则命名，如果用常规的res.authSetting.scope.userInfo肯定不对，所以这里需要用一个方括号把scope.userInfo阔起来并且加上引号，表示这里是取scope.userInfo的值，而不是这个字符串本身
这样基本就完成了小程序用户授权，但是是在用户没有允许的情况下就自动获取了用户的信息，所以这里需要做一个弹窗提示用户是否统一授权
<button wx:if="{{!hasUserInfo && canIUse}}" open-type="getUserInfo" bindgetuserinfo="getUserInfo"> 获取头像昵称 </button>
image.png
这里官方又提供了一个属性 open-type 在这个属性里绑定以下我们获取信息的方法，如果用户点击了确定的话，就调用获取信息的方法
实际操作后会发现，虽然是获取到了，但是需要重新编译一次才能把数据刷新到页面中
image.png
在这个属性的值里面也放上获取用户信息的方法
通过这个方法来判断出用户是点击了允许还是拒绝，如果允许，就获取信息，拒绝就返回
接下来只需要在用户点击确定的时候，再调用一次获取信息的方法就ok了
实现下来会发现，在生命周期函数中，this的指向会出现问题，会报错，
只需要将原本的写法改成箭头函数的写法就可以解决此问题了
