【WePY小程序框架实战四】-使用async&await异步请求数据

async await 是对promise的近一步优化,既解决了promise链式then的这种写法壁垒,又让异步请求更像同步,若对async await不太了解的同学可以直接参考阮一峰老师的文章async 函数的含义和用法,这里我们只关注怎么在小程序wepy架构中如何使用。

依赖库

 import ‘wepy-async-function‘

app.wpy中启用

export default class extends wepy.app {
    constructor () {

        super()
        this.use(‘promisify‘);
    }
}

使用实例


getData(x){
  return new Promise((resolve,reject)=>{
    setTimeout(()=>{
      if(x%2 === 0){
        resolve(x)
      }else{
        reject(`${x}是不正确的输入`);
      }
    },x*1000)
  })
}

async onLoad() {
  try{
    let data1 = await this.getData(2);
    console.log(data1);
    let data2 = await this.getData(1);
    console.log(data2);//已经异常不再执行
  }catch(error){
    console.log(error);
  }
}
调用
onLoad() // 以同一时间为基准,2秒后输出2,3秒后输出 1不是正确的输入

getData().then(fun(),fun()

原文地址:https://www.cnblogs.com/leinov/p/9642949.html

时间: 2024-08-14 18:38:02

【WePY小程序框架实战四】-使用async&await异步请求数据的相关文章

应用程序框架实战四:你需要应用程序框架吗

如果没有什么好处,不会有人愿意去做,那么,你真的需要应用程序框架吗,它能为你带来什么好处? 应用程序框架为你提供现成的开发环境 现在来了一个项目,你可以直接打开VS,然后就开工敲代码吗?不行,你得先创建项目,当使用了分层架构,还需要创建更多的项目,这些项目根据依赖关系进行配置.然后依次引用各种依赖组件,很多组件还需要配置,比如Log4.Net. 配置好项目以后,你还得测试各依赖组件是否能正常工作,可能你的运气比较好,一下就全部测试通过.但也有比较背的时候,半天调不通,这时候你会发现环境问题有时比

小程序里使用es7的async await语法

我们做小程序开发时,有时候想让自己代码变得整洁,异步操作时避免回调地狱.我们会使用es6的promise. es7的async,await .promise在小程序和云开发的云函数里都可以使用. async和await只能在云开发的云函数里使用.我们在小程序的代码里直接使用,就会报如下错误. 这个报错就是告诉我们不能在小程序里直接使用es7的async和await语法.但是这么好的语法我们用起来确实显得代码整洁,逼格高.那接下来我就教大家如何在小程序代码里使用es7的async和await语法.

小程序,wx.request;动态向服务器端请求数据。

wx.request 通过微信封装的ajax,动态向服务器端请求数据.以下是在练习微信小程序时写的测试代码. 其中index.js文件如下 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 //测试: wx.request({      url:'http://hd.jz-lm.com/mobile/Ceshi/index',      method: 'GET',      data: {},      header: {          'Ac

微信小程序使用content-type等于x-www-form-urlencoded方式使用request请求数据

因为服务器只能接收x-www-form-urlencoded方式接收前端收到的数据 所以微信小程序开发的时候,必须鼓捣这个问题. 微信默认使用content-type是 application/json 用wx.request方法改掉header为x-www-form-urlencoded比较简单 wx.request({ 'content-type': 'application/x-www-form-urlencoded' }) 这么干就可以了. 但问题是,微信小程序,似乎不会把我们的数据自动

wepy是一个微信小程序框架

wepy是一个微信小程序框架,支持模块化开发,开发风格类似Vue.js.可搭配redux使用,能同时打包出web和小程序.官方文档地址 目录结构: sotre: redux(如果你创建项目时使用了redux的话) wepy.config.js: webpack配置文件 app.wpy: 入口文件 project.config.json: 小程序项目配置文件 index.template.html: web页面的入口文件 pages: 存放主页面 components: 存放组件 mixins:

零基础入门 实战mpvue2.0多端小程序框架

第1章 课程快速预览(必看!!!)在这一章节中,老师讲带领你快速预览课程整体.其中,涉及到为什么要做这么一门实战课程.制作一个小程序的完整流程是怎么样的,以及如何做项目的技术选型. 第2章 30 分钟快速入门微信小程序(已掌握,可略过)在这一章节中,老师讲带领你从如何注册微信小程序开发者账号.工具的下载开始,到完成第一个小程序,再到组件与 API 的使用整个过程,最后来总结微信原生小程序的缺点. 第3章 30 分钟快速入门 Vue.js 框架(已掌握,可略过)在这一章节中,老师将带领你从第一个

微信小程序教学第三章第四节(含视频):小程序中级实战教程:下拉更新、分享、阅读标识

下拉更新.分享.阅读标识 本文配套视频地址:https://v.qq.com/x/page/h0554... 开始前请把 ch3-4 分支中的 code/ 目录导入微信开发工具 这一篇中,我们把列表这块的剩余功能做完:下拉更新.分享.阅读标识. 下拉更新功能 下拉更新这个功能与我们在第一章中写的小 demo 所用方法一致:onReachBottom. 当用户滚动过程中触发了 上拉 这个动作时候,微信小程序会自动监听到并执行 onReachBottom 这个函数,所以我们只需要把这个监听事件写好就

应用程序框架实战十五:DDD分层架构之领域实体(验证篇)

在应用程序框架实战十四:DDD分层架构之领域实体(基础篇)一文中,我介绍了领域实体的基础,包括标识.相等性比较.输出实体状态等.本文将介绍领域实体的一个核心内容——验证,它是应用程序健壮性的基石.为了完成领域实体的验证,我们在前面已经准备好了验证公共操作类和异常公共操作类. .Net提供的DataAnnotations验证方法非常强大,Mvc会自动将DataAnnotations特性转换为客户端Js验证,从而提升了用户体验.但是客户端验证是靠不住的,因为很容易绕开界面向服务端提交数据,所以服务端

美团小程序框架mpvue蹲坑指南

美团小程序框架mpvue(花名:没朋友)蹲坑指南 第一次接触小程序大概是17年初,当时小程序刚刚内侧,当时就被各种限制折腾的死去活来的,单向绑定, 没有promise,请求数限制,包大小限制,各种反人类,...反正我是感受到了满满的恶意. 最近接到一个工程类的小程序项目,做技术选型的时候,又把以前的东西捡起来看了看,重新熟悉了一下, 感觉小程序还是有在努力的,支持大部分es6语法了,还出了一个类Vue的框架wepy,还支持redux状态管理, 就大致建了个demo,跑了起来,感觉虽然没有vue那