美文网首页小程序微信小程序开发专题
小程序中 Promise解决异步执行的问题

小程序中 Promise解决异步执行的问题

作者: super静_jingjing | 来源:发表于2018-05-24 15:36 被阅读444次

项目需要获取用户的openid,逻辑是在app.js的onLaunch中调用wx.login方法,success之后wx.request去请求后台获取openid;
获取成功之后在page的onLoad方法中使用;
想的很完美,但是实现时发现,在wx.request还未执行完就执行了page的onLoad;
经过一番挣扎,使用Promise解决了这个问题;贴上代码以示尊重。
app.js

App({
  globalData: {
    hostUrl: "https://wxapp.becypress.com/"
  },
  onLaunch: function () {
    // 展示本地存储能力
    var logs = wx.getStorageSync('logs') || []
    logs.unshift(Date.now())
    wx.setStorageSync('logs', logs)
  },
  getOpenid:function(){
    var that = this;
    return new Promise(function (resolve, reject){
      wx.login({
        success: function (res) {
          if (res.code) {
            //发起网络请求
            wx.request({
              url: that.globalData.hostUrl + 'wechat/app/login/' + res.code,
              data: {
              },
              success: function (res) {
                //resolve到index.js的then中  
                resolve(res.data.openid);
              }
            });
          } else {
            console.log('登录失败!' + res.errMsg)
          }
        }
      });
    }); 
  }
})

index.js

var app = getApp();
Page({
  data: {
    url:""
  },
  onLoad: function (options) {
    var that = this;
    app.getOpenid().then(function(openid){
      that.setData({
        url: app.globalData.hostUrl + "app/index.html?opneid=" + openid
      });
    });
  }
})

相关文章

  • 小程序中 Promise解决异步执行的问题

    项目需要获取用户的openid,逻辑是在app.js的onLaunch中调用wx.login方法,success之...

  • ECMAScript6--15.Promise用法

    1.Promise(解决异步操作问题的) 什么是异步比如:函数a,执行一个步骤,a执行完要执行b;有一个顺序问题;...

  • Promise

    前段时间公司小程序项目使用了Promise来解决异步调用的问题,今天简单总结一下 1.Promise 的用法 Pr...

  • Promise.all 方法的实现

    promise.all解决异步并发问题的,允许我们按照异步代码的调用顺序得到异步代码的执行结果。all方法是静态方法,

  • ES6--Promise

    Promise解决异步回调的问题 Promise.all和Promise.race

  • promise原理

    promise存在的原因 promise是异步问题的统一解决方案,在promise出来之前,解决异步只能用回调,回...

  • Promise的小总结

    什么是Promise? promise就是es6统一为了解决异步回调而提出的新的特性,它的好处在于异步执行的流程中...

  • ES6 同步和异步、Promise

    一.同步与异步 1. Promise作用:解决异步回调的问题 二.Promise对象 目的:创建异步对象,当异步对...

  • 回调地狱问题

    使用promise(es6中api)来解决回调地狱的问题。promise1、promise本身不是异步任务但是内部...

  • ES6 promise理解

    一、promise 是什么 1、Promise 是 JS 中解决异步编程的一种方案。 拓展:js中解决异步编程的...

网友评论

  • 6082d6930ad9:定义形参的时候 ,简写了 resolve 冲突了 ,尴尬~~~~
  • 6082d6930ad9:resolve() 报错 not function 需要引入文件吗?
  • 6082d6930ad9:楼主的答案很及时,困扰了我三天 !谢谢

本文标题:小程序中 Promise解决异步执行的问题

本文链接:https://www.haomeiwen.com/subject/epssjftx.html