这篇文章主要介绍了微信小程序开发怎么获取用户信息的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇微信小程序开发怎么获取用户信息文章都会有所收获,下面我们一起来看看吧。
第一中直接授权获取(在同一页面之中):
首先在微信程序一个页面的WXML文件写入获取用户信息的按钮
<!-- bindTap用于绑定事件 -->
<button type="default" bindtap="getUserInfor"> 登录</button>
<!-- 展示获取到的用户信息 -->
<image src="{{userinfor.avatarUrl}}" />
<view> {{userinfor.nickName}}</view>
然后是在js页面写具体点击事件的逻辑结构
data: {
userinfor:{},//用户存放获取到的用户信息
},
getUserInfor(e){
wx.getUserProfile({
desc: '用来完善用户个人信息',//展示的消息
success:(res)=>{
console.log(res.userInfo)//将用户信息打印至控制台
this.setData({ userinfor:res.userInfo})//将信息保存到定义的容器里
}
})
}
第二种方式可以实现不同页面获取用户信息:
第二中的主要思想就是将用户信息先获取到,然后将其存放在缓存中,然后再跳转到其他页面对缓存中的数据进行获取
首先我们要从A页面进入到B页面
A页面WXML代码
<button bindtap="goto" > 进入登录页面</button>
<!-- 展示用户信息 -->
<image src="{{userinfor.avatarUrl}}" />
<view> {{userinfor.nickName}}</view>
A页面JS页面代码
//
data: {
userinfor:{},
},
goto(){
wx.navigateTo({
url: '../text/text',
})
}
B页面WXML页面代码
<button type="default" bindtap="getUserInfor"> 登录</button>
B页面JS页面代码
data: {
},
getUserInfor(e){
wx.getUserProfile({
desc: '用于获取用户信息',
success:(res)=>{
const userinfor = res.userInfo
//将用户数据写入缓存
wx.setStorageSync('UserInfo', userinfor);
//跳回前一个页面
wx.navigateBack({
delta:1
})
}
})
}
当我们点击B页面登录按钮并且允许获取用户信息时,我们可以发现控制台缓存页面会跳出一个KEY值为UserInfo的键值,这就说明我们已经把用户的信息存放入缓存之中,接下来就是如何将缓存中的信息取出来,接下来我们就来到A页面编写获取缓存中数据的方法,
A页面JS页面中添加onShow方法,或者在原有的onShow方法里添加下列方法中的代码
data: {
userinfor:{},
},
onShow(){
const userinfor = wx.getStorageSync('UserInfo')
this.setData({ userinfor })
}
这时就成功将用户数据写入缓存在从其他页面读取数据
关于“微信小程序开发怎么获取用户信息”这篇文章的内容就介绍到这里,感谢各位的阅读!相信大家对“微信小程序开发怎么获取用户信息”知识都有一定的了解,大家如果还想学习更多知识,欢迎关注亿速云行业资讯频道。
亿速云「云服务器」,即开即用、新一代英特尔至强铂金CPU、三副本存储NVMe SSD云盘,价格低至29元/月。点击查看>>
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。