小程序如何支持使用 async/await详解


Posted in Javascript onSeptember 12, 2019

前言

小程序本身是不支持async/await语法的,但有些应用场景,我们使用async/await会使得代码更简洁,也更易于维护,用过都知道是有多爽的。既然小程序不支持,那我们可以借助 fackbook 开源的 regenerator 来完成这一功能。 前面我也百度过一些方法,但很多方法都行不通,只能从其中找到一些线索,再加上实践来验证,最后在这里记录下成功的解决方法。

准备工作

1. 小程序目录下,新建一个packpage.json,通过命令行执行 npm init -y 可以快速创建

2. 安装 regenerator-runtime,命令行执行 npm i regenerator-runtime

3. 打开小程序开发者工具,点击右上角的工具选项,点击构建npm,稍等几秒,小程序目录下会出现 miniprogram_npm 文件夹,里面存放的就是构建完成的npm包

4. 开发者工具右上角 本地设置 勾选 使用npm模块

小程序如何支持使用 async/await详解

npm构建参考文档:https://developers.weixin.qq.com/miniprogram/dev/devtools/npm.html

如何使用

引入 regenerator-runtime

import regeneratorRuntime from 'regenerator-runtime'

小程序如何支持使用 async/await详解

引入的名字必须是 regeneratorRuntime ,这个不是自定义的,必须就是这个名字!

然后就可以正常使用 async/await

小程序如何支持使用 async/await详解

最后

完成上面的步骤后,我在使用时会报一个错误

小程序如何支持使用 async/await详解

后面发现需要删除 regenerator-runtime 文件中一些源码后,才能正常使用。(不知道是哪里出了问题,假如你们在使用时出现这个错误,再参考下面的解决方法)

进入 miniprogram_npm/regenerator-runtime/index.js,大约730行处

小程序如何支持使用 async/await详解

删除 Function("r", "regeneratorRuntime = r")(runtime) 即可

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript function调用时的参数检测常用办法
Feb 26 Javascript
JS拖动技术 关于setCapture使用
Dec 09 Javascript
js调用css属性写法
Sep 21 Javascript
jquery增加和删除元素的方法
Jan 14 Javascript
浅谈vue的踩坑路
Aug 31 Javascript
基于vue.js中关于下拉框的值默认及绑定问题
Aug 22 Javascript
vue框架下部署上线后刷新报404问题的解决方案(推荐)
Apr 03 Javascript
vue 微信扫码登录(自定义样式)
Jan 06 Javascript
Vue vm.$attrs使用场景详解
Mar 08 Javascript
在vue项目中引用Antv G2,以饼图为例讲解
Oct 28 Javascript
基于Vue+Webpack拆分路由文件实现管理
Nov 16 Javascript
Vue常用API、高级API的相关总结
Feb 02 Vue.js
layui清空,重置表单数据的实例
Sep 12 #Javascript
layui table 多行删除(id获取)的方法
Sep 12 #Javascript
详解Vue中CSS样式穿透问题
Sep 12 #Javascript
微信小程序 函数防抖 解决重复点击消耗性能问题实现代码
Sep 12 #Javascript
微信小程序之 catalog 切换实现解析
Sep 12 #Javascript
layui实现checkbox的目录树tree的例子
Sep 12 #Javascript
layui表单提交到后台自动封装到实体类的方法
Sep 12 #Javascript
You might like
php的crc32函数使用时需要注意的问题(不然就是坑)
2015/04/21 PHP
PHP的运行机制与原理(底层)
2015/11/16 PHP
php强大的时间转换函数strtotime
2016/02/18 PHP
ThinkPHP5 框架引入 Go AOP,PHP AOP编程项目详解
2020/05/12 PHP
jQuery使用addClass()方法给元素添加多个class样式
2015/03/26 Javascript
javascript字符串与数组转换汇总
2015/05/26 Javascript
详谈javascript中的cookie
2015/06/03 Javascript
JS实现的5级联动Select下拉选择框实例
2015/08/17 Javascript
JS日期格式化之javascript Date format
2015/10/01 Javascript
javascript动态添加checkbox复选框的方法
2015/12/23 Javascript
如何消除inline-block属性带来的标签间间隙
2016/03/31 Javascript
jQuery Tags Input Plugin(添加/删除标签插件)详解
2016/06/20 Javascript
一个简单不报错的summernote 图片上传案例
2016/07/11 Javascript
纯JS打造网页中checkbox和radio的美化效果
2016/10/13 Javascript
微信小程序 开发之滑块视图容器(swiper)详解及实例代码
2017/02/22 Javascript
利用纯JS实现像素逐渐显示的方法示例
2017/08/14 Javascript
input file样式修改以及图片预览删除功能详细概括(推荐)
2017/08/17 Javascript
jQuery选择器之子元素选择器详解
2017/09/18 jQuery
vue项目每30秒刷新1次接口的实现方法
2018/12/04 Javascript
JavaScript实现学生在线做题计时器功能
2018/12/05 Javascript
jQuery实现的3D版图片轮播示例【滑动轮播】
2019/01/18 jQuery
vue实现学生信息管理系统
2020/05/30 Javascript
原生js实现html手机端城市列表索引选择城市
2020/06/24 Javascript
antd配置config-overrides.js文件的操作
2020/10/31 Javascript
[09:22]2014DOTA2西雅图国际邀请赛 主赛事第二日TOPPLAY
2014/07/21 DOTA
用python 制作图片转pdf工具
2015/01/30 Python
Python操作mongodb数据库进行模糊查询操作示例
2018/06/09 Python
Python wxpython模块响应鼠标拖动事件操作示例
2018/08/23 Python
Python 处理图片像素点的实例
2019/01/08 Python
python 读取文件并把矩阵转成numpy的两种方法
2019/02/12 Python
心理健康心得体会
2014/01/02 职场文书
应聘医药销售自荐书范文
2014/02/08 职场文书
营销与策划实训报告
2014/11/05 职场文书
自荐信格式范文
2015/03/04 职场文书
Vue2.0搭建脚手架
2022/03/13 Vue.js
Nginx工作模式及代理配置的使用细节
2022/03/21 Servers