【uniapp】处理 promise 返回结果

简介: 【uniapp】处理 promise 返回结果

1.问题介绍

我们在uniapp中调用方法时,经常返回结果类型对象是promise

处理方式:
如果某个函数调用的结果打印后返回的是promise,就马上用saync和await进行优化,async放到方法名称的前面,await放到方法里面

示例:

home.vue(main.js中已配置@escook/request-miniprogram网络请求包)

<template>
  <view>
    首页
  </view>
</template>

<script>
  export default {
    data() {
      return {
      };
    },
    onLoad() {
      // this.getOrder()
      this.getOrder()
    },
    methods:{
      getOrder(){
        const res=uni.$http.get(){"url"}
        console.log(res)
      }
    }
  }
</script>

<style lang="scss">

</style>

可以看到没有用async时返回的是一个promise对象

添加async和await后

    methods:{
      async getOrder(){
        const res=await uni.$http.get("/api/public/v1/home/catitems")
        console.log(res)
      }
    }

结果:

2.对promise的理解

  • 由于ajax异步方式请求数据时,我们不能知道数据具体回来的事件,所以过去只能将一个callback函数传递给ajax封装的方法,当ajax异步请求完成时,执行callback函数。
  • promise对象接受resolve和reject两个参数,当一个异步动作发生时,promise对象会通过resolve完成对动作成功进行解析,reject会捕获这个动作的异常。一个promise对象,通过new Promise().then()执行下一步骤操作。
  • axios is a promise based HTTP client for the browser and node.js。也就是说,使用axios发出请求,难免涉及promise

Promise构造函数的参数是一个函数,函数里面的代码是异步的,即Promise里面的操作,和Promise()外面的操作时异步"同时"进行的。此外,只要在函数前面加上async
关键字,也可以指明函数是异步的。

async关键字实际是通过Promise实现,如果async 函数中有返回一个值 ,当调用该函数时,内部会调用Promise.solve()
方法把它转化成一个promise 对象作为返回,但如果timeout 函数内部抛出错误,那么就会调用Promise.reject() 返回一个promise
对象。若某函数调用一个异步函数(比如内部含有primise),该函数应用async修饰。

目录
相关文章
|
前端开发
uni-app中使用 async + await 实现异步请求同步化
uni-app中使用 async + await 实现异步请求同步化
4057 0
uni-app中使用 async + await 实现异步请求同步化
|
JavaScript 前端开发
uniapp如何定义全局变量?
uniapp如何定义全局变量?
915 0
|
7月前
|
JavaScript 开发工具 Android开发
如何在原生 App 中调用 Uniapp 的页面?
如何在原生 App 中调用 Uniapp 的页面?
2094 138
|
小程序 前端开发 API
【微信小程序】TypeError: Cannot read property ‘get‘ of undefined & Error: MiniProgramError
【微信小程序】TypeError: Cannot read property ‘get‘ of undefined & Error: MiniProgramError
|
10月前
|
缓存 iOS开发 MacOS
uniapp发布快应用失败报错Error: ENOENT: no such file or directory以及hap-chimera-toolkit问题优雅草卓伊凡
uniapp发布快应用失败报错Error: ENOENT: no such file or directory以及hap-chimera-toolkit问题优雅草卓伊凡
1075 2
uniapp发布快应用失败报错Error: ENOENT: no such file or directory以及hap-chimera-toolkit问题优雅草卓伊凡
在 Vue.js 中使用 watch 来监听对象属性的变化
在 Vue.js 中使用 watch 来监听对象属性的变化
|
JavaScript
Vue2 sync 修饰符
本文介绍了Vue 2中`.sync`修饰符的用法,它是一种语法糖,用于简化父子组件之间的双向数据绑定,通过在子组件中触发以`update:`为前缀的事件来更新父组件中的数据。
452 20
|
前端开发 JavaScript 安全
在vue前端开发中基于refreshToken和axios拦截器实现token的无感刷新
在vue前端开发中基于refreshToken和axios拦截器实现token的无感刷新
2456 4
|
数据可视化 安全 Android开发
低代码可视化-uniapp蓝牙标签打印-代码生成器
低代码可视化-uniapp蓝牙标签打印-代码生成器
879 0
若依修改,若依部署在本地运行时的注意事项,后端连接了服务器,本地的vue.config.js要先改成localhost:端口号与后端匹配,部署的时候再改公网IP:端口号
若依修改,若依部署在本地运行时的注意事项,后端连接了服务器,本地的vue.config.js要先改成localhost:端口号与后端匹配,部署的时候再改公网IP:端口号

热门文章

最新文章