微信小程序 通过promise/async await解决异步接口网络延迟时间问题的写法
发表时间:2020-9-26
发布人:葵宇科技
浏览次数:120
前提条件
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结果 是 “非挑战者”