zoukankan      html  css  js  c++  java
  • 小程序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

  • 相关阅读:
    phpstudy apache 服务无法启动
    Nginx+keepalived实现负载均衡高可用配置
    Linux系统下zookeeper客户端命令使用
    JVM探究之 —— 类文件结构(脑图)
    JVM探究之 —— 类加载器-双亲委派模型
    Centos7 配置静态IP并使用xshell远程连接
    JVM探究之 —— 类加载过程
    JVM探究之 —— 垃圾回收(二)
    避免git clone和push时每次都需要输入用户名和密码
    jsch配置sftp服务器ssh免密登录
  • 原文地址:https://www.cnblogs.com/remly/p/10706349.html
Copyright © 2011-2022 走看看