【小程序】wepy处理异步请求(promise、async/await、)

实现步骤

1.要使用async/await,得先安装wepy-async-function

npm install wepy-async-function

 

2.在app.wpy文件里引入wepy-async-function

import ‘wepy-async-function’

 

3.采用promise封装异步请求的API

在这里的模拟数据我是在easy-mock.com网站上建立的在线接口

promise用来接收异步请求函数,有成功的回调resolve和失败的回调reject

【小程序】wepy处理异步请求(promise、async/await、)

4.使用封装好的api接口函数

4.1 import封装好的getBanner

4.2 定义async函数,注意async与await是配对使用的

getBanner是包含异步操作的函数,所以this.bannerImg要取得getBanner的值,是需要等待的。

this.bannerImg = getBanner();    // 错误,getBanner是异步函数,所以没办法直接赋值给this.bannerImg

this.bannerImg = await getBanner();  //正确,因为getBanner是异步函数,要拿到异步的结果是需要等待的

loadBanner函数体内有await,所以loadBanner需要加上async(函数体内有await,该函数是async)

4.3 在data里面初始化bannerImg,在onLoad函数里面调用loadBanner,加载数据

【小程序】wepy处理异步请求(promise、async/await、)