详解将微信小程序接口Promise化并使用async函数

春天,大自然一片生机,天空则设计了一个优美的背景。淡蓝的颜色,有些透明,像一块在强烈光照下的蓝宝石,无暇的找不出半点疵瑕。云儿也不知上哪儿玩去了,剩下个特大特明亮的太陽,照得天空泛白。万物在这背景下都是那么的奇妙美好,无处不弥漫着陽光的气味。天空,多么像一位诗人,创造了春天这么美的意境!

前言

小程序一直到现在接口还是和刚开始一样使用的回调函数的方式,如果想在小程序中不使用框架的情况下使用Promise+Async怎么办呢?

2019最新解决方案

1. 将接口Promise化

首先建一个文件wxPromise.js

const promisify = name => option => {
 return new Promise((resolve, reject) =>
  wx[name]({
   ...option,
   success: resolve,
   fail: reject,
  })
 )
}

const wxPro = new Proxy(wx, {
 get(target, prop) {
  return promisify(prop)
 }
})

export default wxPro

2.使用regeneratorRuntime让小程序兼容async函数

在github项目regenerator里下载packages/regenerator-runtime/runtime.js。

如果是最新版本的话引入后会报一个错误:

Function is not a function....

需要手动修改源码:

去掉源码最后的try-catch语句,并将开头的var runtime改成var regeneratorRuntime。

如果不想修改则可以直接下载0.13.1版本的源码。

最后

在想使用的页面里引入:

import wxPro from './utils/wxPromise.js'
import regeneratorRuntime from './utils/runtime.js'

//app.js
App({
 async onLaunch() {
  // wxPro.login().then((res) => {
  //  console.log(res)
  // })
  const result = await wxPro.login()
  console.log(result)
 },
 globalData: {
  userInfo: null
 }
})

这样就可以了,唯一有点麻烦的是每个要用的页面都要引入一次。

到此这篇关于详解将微信小程序接口Promise化并使用async函数就介绍到这了。万事得成于忍,与其能辩,不如能忍。更多相关详解将微信小程序接口Promise化并使用async函数内容请查看相关栏目,小编编辑不易,再次感谢大家的支持!

您可能有感兴趣的文章
微信小程序如何访问公众号文章

微信小程序实现类似微信点击语音播放效果

微信小程序wx.request拦截器使用详解

微信小程序在ios下Echarts图表不能滑动的问题解决

小程序中canvas的drawImage方法参数使用详解