微信小程序 通过promise/async await解决异步接口网络延迟时间问题的写法 - 新闻资讯 - 云南小程序开发|云南软件开发|云南网站建设-昆明葵宇信息科技有限公司

159-8711-8523

云南网建设/小程序开发/软件开发

知识

不管是网站,软件还是小程序,都要直接或间接能为您产生价值,我们在追求其视觉表现的同时,更侧重于功能的便捷,营销的便利,运营的高效,让网站成为营销工具,让软件能切实提升企业内部管理水平和效率。优秀的程序为后期升级提供便捷的支持!

您当前位置>首页 » 新闻资讯 » 小程序相关 >

微信小程序 通过promise/async await解决异步接口网络延迟时间问题的写法

发表时间:2020-9-26

发布人:葵宇科技

浏览次数:85

前提条件

1、微信小程序开发工具需要开启Es6转Es5(未验证是否必要)、增强编译
2、以wx.login()网络请求为例

再根目录下创建api文件夹,并再api文件夹下新建login.js

// api/login.js
module.exports = {
  getLogin : (url, param) => {
    return new Promise((resolve, reject) => {
      wx.login({
        success: res => {
          // 发送 res.code 到后台换取 openId, sessionKey, unionId
          console.log(res.code)
          resolve()
        }
      })
    })
  }
}

在index.js中引入api/login.js文件

//index.js
//获取应用实例
const apiLogin = require('../../api/login')

Page({
  data: {
    isDisplay :false,
    title: "挑战者"
  },

 >: function () {
    this.init();
  },
  // 初始化
  async init () {
    await apiLogin.getLogin()
    console.log("在code之后打印");
    this.setData({
      isDisplay :true,
      title: "非挑战者"
    })
  }
})

标题index.wxml中键入代码

<view wx:if="{{isDisplay}}">
<p>"{{title}}"</p>
</view>

运行打印结果

1、工作台中 “在code之后打印” 几个字将会在wx.login中code打印后进行打印
2、页面中的结果将在执行完wx.login()请求完毕以后再展示,并且展示
的title结果 是 “非挑战者”

相关案例查看更多