怎么使微信小程序支持async await？

微信小程序并不支持async，写起代码来太不舒服了.
各种回调会造成回调地狱的问题，回调函数一层套着一层，代码难以阅读，后期难以维护的问题

解决办法：

使用regenerator-runtime

regenerator-runtime是facebook的regenerator模块
生成器函数、async、await函数经babel编译后，regenerator-runtime模块用于提供功能实现。

引入facebook/regenerator 中的packages/regenerator-runtime/runtime.js

步骤1 引入并注册

因全局都要用到，所有在app.js中引入,并注册全局对象中.

app.js

import regeneratorRuntime from './lib/runtime'  App({     ...      regeneratorRuntime,      onLaunch(){},      onShow() {},      onHide() {},      ... })

步骤2 封装request

request.js

const METHOD = {     GET: 'GET',     POST: 'POST',     PUT: 'PUT',     DELETE: 'DELETE' }  let baseUrl = '' const interceptors = []  class Request {     /**      * response interceptor      */     intercept(res, resolve, reject) {         return interceptors             .filter((f) => typeof f === 'function')             .every((f) => f(res, resolve, reject))     }      /**      * request      */     request(option) {         const header = {             'content-type': 'application/x-www-form-urlencoded'         }         const { url, method, data = {} } = option          return new Promise((resolve, reject) => {             try {                 wx.request({                     url: baseUrl + url,                     method: method || METHOD.GET,                     data,                     header,                     success: (res) => this.intercept(res, resolve, reject),                     fail: (err) => {                         if (                             err &&                             err.errMsg &&                             err.errMsg.indexOf('request:fail') !== -1                         ) {                             console.error('wx request error: ', err)                         } else {                             wx.showToast({                                 title: JSON.stringify(err),                                 icon: 'none',                                 duration: 10000                             })                         }                     }                 })             } catch (err) {                 wx.showToast({ title: err.message, icon: 'none' })             }         })     }      get(url, data) {         return this.request({ url, method: METHOD.GET, data })     }      post(url, data) {         return this.request({ url, method: METHOD.POST, data })     }      put(url, data) {         return this.request({ url, method: METHOD.PUT, data })     }      delete(url, data) {         return this.request({ url, method: METHOD.DELETE, data })     }      all(tasks) {         return Promise.all(tasks)     } }  /**  * 设置base URL  */ function setBaseUrl(url) {     baseUrl = url }  /**  * 默认response拦截器  */ function addDefaultInterceptor() {     interceptors.push((res, resolve, reject) => {         const status = res.statusCode         if (status !== 200) {             return reject(new Error(`internet error: ${status}`))         }         const body = res.data         if (body.errno !== 0) {             return reject({                 message: body.error,                 body             })         }         return resolve(body.data)     }) }  const request = new Request()  export { setBaseUrl, addDefaultInterceptor, request }

步骤3 使用async await

如：

import { request, setBaseUrl, addDefaultInterceptor } from './lib/request'  addDefaultInterceptor()  App({     ...      async onLaunch() {         const userInfo = await request.get('/user/info')         console.log(userInfo)     }      ... })

小程序原生api使用async await

不用再写各种success、fail等回调了，代码清晰很多，易读性更强.

步骤1 封装原生api用Promise化

wxp.js

/**  * promise微信API方法  */ function wxPromise(api) {     function func(options, ...params) {         return new Promise((resolve, reject) => {             api(                 Object.assign({}, options, {                     success: (res) => {                         resolve(res)                     },                     fail: reject                 }),                 ...params             )         })     }      return func }  export default {     // 界面交互     showToast: wxPromise(wx.showToast),     showLoading: wxPromise(wx.showLoading),     showModal: wxPromise(wx.showModal),     showActionSheet: wxPromise(wx.showActionSheet),     // 导航条     setNavigationBarTitle: wxPromise(wx.setNavigationBarTitle),     setNavigationBarColor: wxPromise(wx.setNavigationBarColor),     setTopBarText: wxPromise(wx.setTopBarText),     // 导航     navigateTo: wxPromise(wx.navigateTo),     redirectTo: wxPromise(wx.redirectTo),     switchTab: wxPromise(wx.switchTab),     reLaunch: wxPromise(wx.reLaunch),      // 用户相关     login: wxPromise(wx.login),     checkSession: wxPromise(wx.checkSession),     authorize: wxPromise(wx.authorize),     getUserInfo: wxPromise(wx.getUserInfo),      // 支付     requestPayment: wxPromise(wx.requestPayment),      // 图片     chooseImage: wxPromise(wx.chooseImage),     previewImage: wxPromise(wx.previewImage),     getImageInfo: wxPromise(wx.getImageInfo),     saveImageToPhotosAlbum: wxPromise(wx.saveImageToPhotosAlbum),      // 文件     uploadFile: wxPromise(wx.uploadFile),     downloadFile: wxPromise(wx.downloadFile),      // 录音     startRecord: wxPromise(wx.startRecord),      // 音频播放     playVoice: wxPromise(wx.playVoice),      // 音乐播放     getBackgroundAudioPlayerState: wxPromise(wx.getBackgroundAudioPlayerState),     playBackgroundAudio: wxPromise(wx.playBackgroundAudio),     seekBackgroundAudio: wxPromise(wx.seekBackgroundAudio),      // 视频     chooseVideo: wxPromise(wx.chooseVideo),     saveVideoToPhotosAlbum: wxPromise(wx.saveVideoToPhotosAlbum),      // 文件     saveFile: wxPromise(wx.saveFile),     getFileInfo: wxPromise(wx.getFileInfo),     getSavedFileList: wxPromise(wx.getSavedFileList),     getSavedFileInfo: wxPromise(wx.getSavedFileInfo),     removeSavedFile: wxPromise(wx.removeSavedFile),     openDocument: wxPromise(wx.openDocument),      // 数据缓存     setStorage: wxPromise(wx.setStorage),     getStorage: wxPromise(wx.getStorage),     getStorageInfo: wxPromise(wx.getStorageInfo),     removeStorage: wxPromise(wx.removeStorage),      // 位置     getLocation: wxPromise(wx.getLocation),     chooseLocation: wxPromise(wx.chooseLocation),     openLocation: wxPromise(wx.openLocation),      // 设备     getSystemInfo: wxPromise(wx.getSystemInfo),     getNetworkType: wxPromise(wx.getNetworkType),     startAccelerometer: wxPromise(wx.startAccelerometer),     stopAccelerometer: wxPromise(wx.stopAccelerometer),     startCompass: wxPromise(wx.startCompass),     stopCompass: wxPromise(wx.stopCompass),     // 打电话     makePhoneCall: wxPromise(wx.makePhoneCall),     // 扫码     scanCode: wxPromise(wx.scanCode),     // 剪切板     setClipboardData: wxPromise(wx.setClipboardData),     getClipboardData: wxPromise(wx.getClipboardData),     // 蓝牙     openBluetoothAdapter: wxPromise(wx.openBluetoothAdapter),     closeBluetoothAdapter: wxPromise(wx.closeBluetoothAdapter),     getBluetoothAdapterState: wxPromise(wx.getBluetoothAdapterState),     startBluetoothDevicesDiscovery: wxPromise(wx.startBluetoothDevicesDiscovery),     stopBluetoothDevicesDiscovery: wxPromise(wx.stopBluetoothDevicesDiscovery),     getBluetoothDevices: wxPromise(wx.getBluetoothDevices),     getConnectedBluetoothDevices: wxPromise(wx.getConnectedBluetoothDevices),     createBLEConnection: wxPromise(wx.createBLEConnection),     closeBLEConnection: wxPromise(wx.closeBLEConnection),     getBLEDeviceServices: wxPromise(wx.getBLEDeviceServices),     // iBeacon     startBeaconDiscovery: wxPromise(wx.startBeaconDiscovery),     stopBeaconDiscovery: wxPromise(wx.stopBeaconDiscovery),     getBeacons: wxPromise(wx.getBeacons),     // 屏幕亮度     setScreenBrightness: wxPromise(wx.setScreenBrightness),     getScreenBrightness: wxPromise(wx.getScreenBrightness),     setKeepScreenOn: wxPromise(wx.setKeepScreenOn),     // 振动     vibrateLong: wxPromise(wx.vibrateLong),     vibrateShort: wxPromise(wx.vibrateShort),     // 联系人     addPhoneContact: wxPromise(wx.addPhoneContact),     // NFC     getHCEState: wxPromise(wx.getHCEState),     startHCE: wxPromise(wx.startHCE),     stopHCE: wxPromise(wx.stopHCE),     sendHCEMessage: wxPromise(wx.sendHCEMessage),     // Wi-Fi     startWifi: wxPromise(wx.startWifi),     stopWifi: wxPromise(wx.stopWifi),     connectWifi: wxPromise(wx.connectWifi),     getWifiList: wxPromise(wx.getWifiList),     setWifiList: wxPromise(wx.setWifiList),     getConnectedWifi: wxPromise(wx.getConnectedWifi),      // 第三方平台     getExtConfig: wxPromise(wx.getExtConfig),      // 转发     showShareMenu: wxPromise(wx.showShareMenu),     hideShareMenu: wxPromise(wx.hideShareMenu),     updateShareMenu: wxPromise(wx.updateShareMenu),     getShareInfo: wxPromise(wx.getShareInfo),      // 收货地址     chooseAddress: wxPromise(wx.chooseAddress),      // 卡券     addCard: wxPromise(wx.addCard),     openCard: wxPromise(wx.openCard),      // 设置     openSetting: wxPromise(wx.openSetting),     getSetting: wxPromise(wx.getSetting),      // 微信运动     getWeRunData: wxPromise(wx.getWeRunData),      // 打开小程序     navigateToMiniProgram: wxPromise(wx.navigateToMiniProgram),     navigateBackMiniProgram: wxPromise(wx.navigateBackMiniProgram),      // 获取发票抬头     chooseInvoiceTitle: wxPromise(wx.chooseInvoiceTitle),      // 生物认证     checkIsSupportSoterAuthentication: wxPromise(wx.checkIsSupportSoterAuthentication),     startSoterAuthentication: wxPromise(wx.startSoterAuthentication),     checkIsSoterEnrolledInDevice: wxPromise(wx.checkIsSoterEnrolledInDevice) }

以上为小程序基本的api整理，贴出来供大家使用~

步骤2 使用

import wxp from './lib/wxp'  App({     ...      wxp,      async onLaunch() {         const res = await wxp.getSystemInfo()         console.log(res)     }      ... })