uniapp微信小程序授权手机号和授权用户信息

uniapp 微信授权登录
前提：想要授权的话 一定要是小程序的开发者。不然头像的标签。授权等等都无法实现
uniapp 提供获取手机号的按钮 和 授权登陆的按钮
话不多说----上菜

<!-- 用户信息登录 -->
<button 
	type="default" 
	class="loginButton" 
	open-type="getUserInfo"  
	@click="getUserInfo"
>
	<view class="row">
		<view class="icon">
		  <u-icon name="weixin-fill" size="28"></u-icon>
		</view>
		<view style="font-size: 30rpx;">微信登录</view>
	</view>
</button>
<!-- 手机号登录 -->
<button
  type="default"
  class="loginButton"
  open-type="getPhoneNumber"
  @getphonenumber="getPhoneNumber"
>
  <view class="row">
    <view class="icon">
      <u-icon name="weixin-fill" size="28"></u-icon>
    </view>
    <view style="font-size: 30rpx">微信登录</view>
  </view>
</button>

// 用户信息
getUserInfo(e) {
    
    
   uni.getUserProfile({
    
    
       desc: "登录授权", // 这个参数是必须的
       success: (res) => {
    
    
         console.log("获取用户信息", "第一个", res.userInfo);
         this.userInfo = res.userInfo;
       },
       fail:(err) =>{
    
    
         console.log(err)
       }
     });
 },
 // 获取 获取手机号的code并授权
 getPhoneNumber(e) {
    
    
     let detail = e.detail;
     if (detail.errMsg === "getPhoneNumber:ok") {
    
    
       let that = this;
       this.phoneCode = detail.code;
       if (this.phoneCode) {
    
    
       	 // 拿到code需要给后端 接口帮你获取到手机号
         this.getUserPhone();
       }
       else {
    
    
         this.login();
       }
     } else {
    
    
       console.log("取消授权！");
     }
 },
 // 获取用户手机号-接口
 getUserPhone() {
    
    
   this.$http
     .getPhone({
    
    
       code: this.phoneCode,
       access_token: this.access_token,
     })
     .then((res) => {
    
    
       // console.log("用户手机号res====>",res)
       if (res.success) {
    
    
         let resDatas = res.datas;
         let phoneInfo = JSON.parse(resDatas.phone_info);
         // console.log("获取到的用户手机号相关信息=====>>>>>>", phoneInfo)
         this.phoneNumber = phoneInfo.phoneNumber;
         console.log("获取到的用户手机号=====>>>>>>", this.phoneNumber);
       }
     });
 },