关于wx.request返回data数据解析抽风的问题

此方法为小白博主在仿音乐小程序项目过程中的解决办法，其原理也只是博主自行理解的，如有错误或者知道更正确的原因希望各位指正

参考资料:

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

微信官方文档

• wx.request的简单语法

Page({
  data: {
    myData: ''
  },
  // loadMyData函数用于打印myData的值
  loadMyData () {
    console.log('获取到的数据为：' + this.data.myData)
  },
  // 生命周期函数onload用于监听页面加载
  onl oad: 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()
  }
})

结果会先执行loadMyData()函数，因为wx.request试异步请求，JS不会等待wx.request执行完毕再往下执行，所以JS按顺序会先执行this.loadMyData，等服务器返回数据之后loadMyData()已经执行完毕，也就是没拿到值的原因

关于“返回”，其实在同步的流程中才会说返回，而异步里没有“返回”的概念（或者说异步返回是没有意义的），异步对应的是“回调”，也就是说对于一个异步函数，应该传入一个“回调函数”来接收结果

• 实际操作遇到的问题

一个页面onload同时发送两个接口请求的时候，返回的数据解析偶尔会抽风

这里可以看到，拿到的数据data并没有正确解析成JSON对象，而是会抽风解析成string或者直接变成空值，主要原因还是因为我在onload过程中写了两个获取函数并且没有异步处理，导致两个接口同时请求的过程中发生错误

发生这个错误的原因在结合微信网络文档以及网上一部分资料表示初步猜测为异步问题，实际上在这之前我已经对request进行了Promise封装

要解决问题只要在一个接口请求完之后在请求另一个就不会出现data解析错误抽风的问题了