小程序容器助力企业在金融与物联网领域实现高效合规运营，带来的新机遇与挑战如何管理？
1038
2023-11-12
微信小程序开发之获取用户信息的两种方法
今天介绍两种微信小程序获取用户信息的方法
第一中直接授权获取（在同一页面之中）：
首先在微信程序一个页面的WXML文件写入获取用户信息的按钮
?
1
2
3
4
5
<!-- bindTap用于绑定事件 -->
<button type="default" bindtap="getUserInfor"> 登录</button>
<!-- 展示获取到的用户信息 -->
<image src="{{userinfor.avatarUrl}}" />
<view> {{userinfor.nickName}}</view>
然后是在js页面写具体点击事件的逻辑结构
?
1
2
3
4
5
6
7
8
9
10
11
12
data: {
userinfor:{},//用户存放获取到的用户信息
},
getUserInfor(e){
wx.getUserProfile({
desc: 用来完善用户个人信息,//展示的消息
success:(res)=>{
console.log(res.userInfo)//将用户信息打印至控制台
this.setData({ userinfor:res.userInfo})//将信息保存到定义的容器里
}
})
}
第二种方式可以实现不同页面获取用户信息：
第二中的主要思想就是将用户信息先获取到，然后将其存放在缓存中，然后再跳转到其他页面对缓存中的数据进行获取
首先我们要从A页面进入到B页面
A页面WXML代码
A页面JS页面代码
?
1
2
3
4
5
6
7
8
9
10
//
data: {
userinfor:{},
},
goto(){
wx.navigateTo({
url: ../text/text,
})
}
B页面WXML页面代码
?
1
<button type="default" bindtap="getUserInfor"> 登录</button>
B页面JS页面代码
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
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方法里添加下列方法中的代码
?
1
2
3
4
5
6
7
data: {
userinfor:{},
},
onShow(){
const userinfor = wx.getStorageSync(UserInfo)
this.setData({ userinfor })
}
这时就成功将用户数据写入缓存在从其他页面读取数据
总结
其实两种获取方式都是一样的，都是用wx.getUserProfile方法进行获取，但是只是采取了不同的数据处理方式，让开发更加的便捷
到此这篇关于微信小程序开发之获取用户信息的文章就介绍到这了,更多相关微信小程序获取用户信息内容请搜索
您可能感兴趣的文章:微信小程序用户信息encryptedData详解微信小程序如何获取用户信息微信小程序如何同时获取用户信息和用户手机号微信小程序获取用户信息的两种方法wx.getUserInfo与open-data实例分析微信小程序wx.getUserInfo授权获取用户信息(头像、昵称)的实现微信小程序实现授权登录之获取用户信息小程序获取用户信息的两种方法详解(getUserProfile和头像昵称填写)
版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。
相关文章
发表评论
最近发表
推荐文章
热评文章
暂时没有评论，来抢沙发吧~