微信小程序踩坑系列——从wx.request谈谈异步处理 - CSDN文库

需积分: 26 199 浏览量更新于2023-04-28 1 收藏 121KB PDF 举报

身份认证购VIP最低享 7 折!

领优惠券(最高得80元）

资源详情

资源推荐

微信小程序踩坑系列微信小程序踩坑系列——从从wx.request谈谈异步处理谈谈异步处理

见到wx.request的第一眼，就让我想起了$.ajax这东西，使用起来确实有很多不方便，不能忍，幸好小程序是支持ES6语法

的，所以可以使用promise稍加改造。

先来说说wx.request为什么不能忍。

铺垫：铺垫：“看得见却抓不住看得见却抓不住“的异步请求的异步请求

Page({

data: {

myData: ''

},

// loadMyData函数用于打印myData的值

loadMyData () {

console.log('获取到的数据为：' + this.data.myData)

},

// 生命周期函数onload用于监听页面加载

onload: function () {

wx.request({

url: 'https://api', // 某个api接口地址

success: res => {

console.log(res.data)

this.setData({

myData: res.data

})

console.log(this.data.myData)

}

})

// 调用之前的函数

this.loadMyData()

}

})

然后我们会在控制台到这样的结果：

(此图片来源于网络，如有侵权，请联系删除! )

这其实是一个很简单的异步问题，wx.request是异步请求，JS不会等待wx.request执行完毕再往下执行，所以JS按顺序会先执

行this.loadMyData()，等服务器返回数据以后，loadMyData()早就执行完了，当然也就没有拿到值啦。

其实我们在同步流程中才说“返回”，异步没有“返回”这个概念（或者说异步返回是没有意义的），异步对应的是“回调”，也就是

说，对于一个异步函数，我们应该传入一个“回调函数”来接收结果。

初步解决：通过回调接收结果初步解决：通过回调接收结果

最简单的解决方案，就是把需要使用异步数据的函数写在回调里：

本内容试读结束，登录后可阅读更多

下载后可阅读完整内容，剩余2页未读，立即下载

weixin_38578242

粉丝: 3
资源: 945

会员权益专享

图片转文字

全年可省5，000元立即开通

最新资源

资源上传下载、课程学习等过程中有任何疑问或建议，欢迎提出宝贵意见哦~我们会及时处理！点击此处反馈