小程序授权登陆流程

• 小程序授权登陆流程

• 点击登录跳转登录页面        在该html里

  <button type="primary" open-type="getUserInfo" bindgetuserinfo="getUserMes">登录</button>
  

   

   getUserMes(e){
  
      let userMesg=e.detail   // e.detail 里有我们 要的用户详细数据
      wx.setStorageSync('userMes', userMesg)  // 存到本地
      wx.navigateBack({   // 返回刚才页面
        delta: 1,    
      })
    },

  在返回的页面 获取数据 渲染

  data: {   //在这我就渲染了 两个数据 
      username: '',  // 微信的昵称
      userpic: '',  //  微信头像
    },
  
  
  onShow: function () {
      let user = wx.getStorageSync('userMes') ||[]  // 获取用户信息  没有存 就为空
      if (user!='') {   // 如果不为空 才执行  解决报错
        this.setData({
          username: user.userInfo.nickName || '',  //  获取微信的昵称
          userpic: user.userInfo.avatarUrl || '',  //  获取微信的头像
        });
      }
  
    },

  html：

  <view class="top user_info_wrap">
    <view wx:if="{{username}}" class="user_img_wrap">
      <image class="user_bg" src="{{userpic}}" ></image>
      <view class="user_info">
        <image class="user_icon" src="{{userpic}}"></image>
        <view class="user_name">{{username}}</view>
    </view>
    </view>
  
    <view wx:else class="inner" bindtap="login">
      登录
    </view>
  </view>