1.主要代码实现
index.wxml文件
<view class=\'indexContainer\'> <image class=\'avatar\' src=\'{{userInfo.avatarUrl}}\'></image> <button bindgetuserinfo=\'handleGetUserInfo\' style=\'display:{{isShow?"block":"none"}}\' open-type="getUserInfo">获取登录用户信息</button> <text class=\'userName\'>hello {{userInfo.nickName}}</text> <view catchtap="handleClick" class=\'goStudy\'> <text >开启小程序之旅</text> </view> </view>
index.js文件
主要使用了wx.switchTab用于页面跳转,wx.getSetting用于获取用户的当前是否授权的信息,wx.getUserInfo用于获取用户信息。主要思路是:在页面加载时首先判断用户是否之前授权过,若有授权直接登录,若没有授权需要点击获取登录用户信息按钮进行授权操作。
const app = getApp() Page({ data: { msg: \'\', userInfo: {}, isShow: true, }, handleClick(){ //点击跳转到对应页面 wx.switchTab({ //不能使用wx.navigateTo url: \'/pages/list/list\' }) }, //做一些初始化工作,发送请求,开启定时器等 onLoad() { console.log("页面加载") this.getUserProfile() }, getUserProfile(e) { //查看是否授权 wx.getSetting({ success:(res)=>{ if (res.authSetting[\'scope.userInfo\']) { // 已经授权,可以直接使用wx.getUserProfile获取用户信息 console.log("用户已经授权") wx.getUserInfo({ success: (res)=>{ this.setData({ userInfo: res.userInfo, isShow: false }) console.log(res.userInfo) } }) }else{ //用户没有授权 console.log("用户没有授权") this.setData({ isShow: true }) } } }) }, handleGetUserInfo(res){ //判断用户点击的是否是允许 if(res.detail.rawData){ //允许 this.getUserProfile() } } })
2.效果图
3.问题
在页面进行跳转时,会出现以下问题:
查看文档发现是因为wx.navigateTo不允许跳转到tabbar页面。
最终采用wx.switchTab进行页面跳转。
请发表评论