小程序app.onLaunch中获取用户信息,index.onLoad初次载入时取不到值的问题
问题描述:
//app.js
App({
globalData:{
nickname:''
},
onLaunch: function () {
let that=this;
//假设已经授权成功
wx.getUserInfo({
success(res){
//获取用户信息并赋值给globalData
that.globalData.nickname=res.userInfo.nickName;
}
}) }
}) //index.js
const app = getApp()
Page({
data: {
myNickName:''
},
onLoad: function (option) {
console.log(app.globalData.nickname); //结果:""
this.setData({
myNickName:app.globalData.nickname
})
//由于wx.getUserInfo()是异步请求,不知道什么时候成功返回数据,导致获取失败
}
})
时序图描述:

解决方案
//app.js
App({
globalData:{
nickname:''
},
onLaunch: function () {
let that=this;
//假设已经授权成功
wx.getUserInfo({
success(res) {
let tmp=res; setTimeout(()=>{//更清楚的模拟异步环境,设置5秒后执行代码
//获取用户信息并赋值给globalData
that.globalData.nickname = res.userInfo.nickName;
if (that.userInfoReadyCallback) {
console.log('call back')
that.userInfoReadyCallback(res.userInfo.nickName)
}
},5000) }
}) }
}) //index.js
const app = getApp()
Page({
data: {
myNickName:''
},
onLoad: function (option) {
let that = this;
let mynickname = app.globalData.nickname;
//如果app.onLaunch中的wx.getUserInfo()返回够快
//在app.onLoad之前就已经初始化了app.globalData.nickname则直接更新本界面的this.data.nickname
if(mynickname.length){
this.setData({
nickname:mynickname
})
//定义回调函数,一旦app.onLaunch的wx.getUserInfo获取到用户信息的时候,立即运行该回调函数
}else{
app.userInfoReadyCallback=res=>{
this.setData({
nickname:res
})
}
}
}
})
解决方案时序图:

总结
1.巧用回调函数
参考:https://blog.csdn.net/zjw_python/article/details/80641963
小程序app.onLaunch中获取用户信息,index.onLoad初次载入时取不到值的问题的更多相关文章
- 微信小程序~App.js中获取用户信息
(1)代码:主要介绍下获取用户信息部分 onLaunch: function () { // 展示本地存储能力 var logs = wx.getStorageSync('logs') || [] l ...
- 微信小程序-form表单-获取用户输入文本框的值
微信小程序-form表单-获取用户输入文本框的值 <input name='formnickname' class="textarea" placeholder=" ...
- 微信小程序在组件中获取界面上的节点信息wx.createSelectorQuery
节点信息查询 API 可以用于获取节点属性.样式.在界面上的位置等信息. 最常见的用法是使用这个接口来查询某个节点的当前位置,以及界面的滚动位置. 示例代码: const query = wx.cre ...
- 明令禁止下,哪些APP在违规获取用户信息?
2019年4月28日消息 移动互联网时代各大APP大行其道,用户为了更便捷地享受互联网服务,常常需要让渡部分个人信息.在信息获取不透明的情况下,不少APP运营企业出现过度获取乃至违规获取用户信息的情 ...
- 微信小程序app.js中设置公有变量
初始化GlobalData 在App.js的最上方可以设置GlobalData的初始值. App({ globalData:{ appid: '1wqas2342dasaqwe232342xxxxxx ...
- 小程序使用wx.chooseAddress获取用户手机号码,微信chooseAddress接口获取用户收货信息
通常用户在商城购买产品后,需要填写他的收货信息,方便我们发货,但是在手机上写字非常不方便,一个客户的收货信息包括:姓名,地址和手机号码这些内容全部填写的话,至少要写20个字. 地址 所以有些客户在手机 ...
- 微信小程序~App.js中登录
(1)初始化项目中App.js登录代码 // 登录 wx.login({ success: res => { // 发送 res.code 到后台换取 openId, sessionKey, u ...
- 微信小程序---app.json中设置背景色不生效解决办法
按照官方文档的说明,backgroundColor应该可以设置窗口的背景色. "window":{ "backgroundTextStyle":"li ...
- uniapp 在h5和小程序上使用高德获取用户城市位置
开发文档 https://lbs.amap.com/api 错误状态 https://lbs.amap.com/api/webservice/guide/tools/info/ 虽然用的高德但是你还需 ...
随机推荐
- 分布式协调服务Zookeeper集群搭建
分布式协调服务Zookeeper集群搭建 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.安装jdk环境 1>.操作环境 [root@node101.yinzhengjie ...
- socket(TCP-粘包)通讯之Python实现
所谓粘包问题主要还是C/S两端数据传输时 因为接收方不知道消息之间的界限,不知道一次性提取多少字节的数据所造成的 根本原因:粘包是由TCP协议本身造成的,TCP为提高传输效率,发送方往往要收集到足够多 ...
- Airflow Comman Line 测试
官网文档:https://incubator-airflow.readthedocs.io/en/latest/cli.html clear (1)clear 指定日期某一个dag下的任务,任务名可以 ...
- 第三节:Windows平台部署Asp.Net Core应用(基于IIS和Windows服务两种模式)
一. 简介 二. 文件系统发布至IIS 三. Web部署发布至IIS 四. FTP发布至IIS 五. Windows服务的形式发布 ! 作 者 : Yaopengfei(姚鹏飞) 博客地址 ...
- 077、跨主机使用Rex-Ray volume (2019-04-24 周三)
参考https://www.cnblogs.com/CloudMan6/p/7630205.html 上一节我们在docker1上创建mysql容器,并使用了 Rex-Ray volume mys ...
- 微信小程序版本自动更新弹窗提示
代码如下: onLaunch () { if (wx.canIUse('getUpdateManager')) { const updateManager = wx.getUpdateManager( ...
- Swagger UI及 Swagger editor教程 API文档搭配 Node使用
swagger ui 是一个在线文档生成和测试的利器,目前发现最好用的.为啥好用呢?打开 demo,支持API自动生成同步的在线文档些文档可用于项目内部API审核方便测试人员了解 API这些文档可作为 ...
- meterpreter基础命令大全
meterpreter meterpreter是Metasploit框架中的一个扩展模块,作为溢出成功以后的攻击载荷使用.为后渗透提供了很多便捷之处 基础命令 我们进入meterpreter之后,键入 ...
- Swift PlayGround无限Running问题
这个问题我想肯定很多人都有遇到过,如果你正好面试iOS,用这个playground写算法的话遇到这种情况只能hehe了-- 我是这样解决的,一开始我build project的时候选得是iOS的pla ...
- flex弹性盒子的使用
前言:这是笔者学习之后自己的理解与整理.如果有错误或者疑问的地方,请大家指正,我会持续更新! CSS3引入了一种新的布局模型—— flex 布局.flex是 flexible box 的缩写,一般称之 ...