第147篇:微信小程序开发中Promise的使用(aysnc,await)

news/2024/10/19 12:17:18

好家伙,

 

0.错误描述

今天在开发中犯了一个比较严重的错误

对于Promise的错误使用

 

场景:

微信小程序中展示搜索条件列表

// API请求工具函数
const apiRequest = (url, method = 'GET', headers = {}) => {return new Promise((resolve, reject) => {wx.request({url,method,header: headers,success: (res) => resolve(res),fail: (error) => reject(error)});});
};const fetchTypelist = async () => {const app = getApp();const queryParams = app.globalData.queryParams;console.log(queryParams)let url = `${API_BASE_URL}/industryType/page?pageNo=1&pageSize=10`;// 添加常规的查询参数for (const [key, value] of Object.entries(queryParams)) {if (value) {url += `&${key}=${encodeURIComponent(value)}`;}}try {const headers = {}; // 如果需要token,可以在这里添加const response = await apiRequest(url, 'GET', headers);if (response.data.code === 200) {console.log(response.data)return response} else {throw new Error('获取地址列表失败');}} catch (error) {throw error;}
};/.................../
调用方法let result = fetchTypelist()
console.log(result)

 

 

猜猜会打印什么?

 一个promise是的仅仅只是一个promise,并没有拿到请求返回的结果

 

1.分析

async 函数默认返回一个 Promise,即使你在 async 函数中显式返回了值。

当你调用 async定义的函数 (fetchTypelist) 时,返回的实际上是一个 Promise,而不是直接返回的数据。

 

2.解决方法

2.1.使用await等待方法的执行,获取返回值

const getTypelist = async () => {try {const typelist = await fetchTypelist();console.log(typelist); // 这里可以获取到返回的 rows
  } catch (error) {console.error(error); // 处理错误
  }
};

 

 

2.2.使用链式调用.then()来处理promise

fetchTypelist().then((typelist) => {console.log(typelist);}).catch((error) => {console.error(error);});

 

 

 

3.成功获取

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.ryyt.cn/news/72740.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈,一经查实,立即删除!

相关文章

Playable Director

目录组件介绍字段说明使用Timeline资源 组件介绍Unity原生组件,Playable Director 组件存储时间轴实例和时间轴资源之间的链接。Playable Director 组件控制时间轴实例的播放时间、时间轴实例更新其时钟的方式以及在时间轴实例完成播放后发生的操作。字段说明playable TimeLin…

细说STC15单片机I/O口的四种工作模式

STC15单片机I/O口有四种模式,分别是准双向口、推挽输出、高阻输入和开漏输出。那么什么是准双向口、推挽输出、高阻输入和开漏输出呢?单片机的这四种模式又是怎么体现出来呢?我们来看看STC15芯片手册上各种模式的说明如下图所示。 准双向口:与传统8051的P1、P2和P3口相同模…

dp一遍通

前言 马上csp-s考试了,却发现自己dp太菜了,打算恶补dp 线性dp理解 递推/记忆化搜索,有很多种理解方式 递归重叠子问题的记忆化搜索:像这里例如 \(f[3]\) 可以通过一次计算得到,保存答案,下一次直接调用即可,省去很多复杂度 我们从此引出dp第一个性质:最优子结构 大问题…

数据采集与融合技术作业二

目录作业①实验要求及结果心得体会作业②实验要求及结果心得体会作业③实验要求及结果心得体会码云连接作业① 实验要求及结果要求 在中国气象网(http://www.weather.com.cn)给定城市集的7日天气预报,并保存在数据库。 代码点击查看代码 from bs4 import BeautifulSoup, Uni…

多校A层冲刺NOIP2024模拟赛08

多校A层冲刺NOIP2024模拟赛08\(T1\) A. 传送 (teleport) \(0pts\)弱化版: [ABC065D] Built? | luogu P8074 [COCI2009-2010#7] SVEMIR | “迎新春,过大年”多校程序设计竞赛 H 二次元世界之寻找珂朵莉先不管后面加入的 \(m\) 条边。对于两点间的路径 \(i \to j\) ,经过中转…

KubeSphere v4 安装指南

日前,KubeSphere v4 发布,相较于之前的版本,新版本在架构上有了颠覆性的变化。为了让社区的各位小伙伴能够丝滑的从旧版本过渡到新版本,我们特别推出本篇安装指南文章,以供参考。 关于 KubeSphere v4 的介绍,请阅读本文:KubeSphere v4 开源并发布全新可插拔架构 LuBan。…

Graphic Raycaster

参数解释Graphic Raycaster —— 射线检测Ignore Reversed Graphics 是否忽略反方向图形,勾选此选项时反转180的图形将不接受射线检测,否则正反面都接受 Blocking Objects 屏蔽指定对象类型,None 都不屏蔽 Two D 屏蔽具有2D碰撞体的2D物理对象,Three D 屏蔽具有3D碰撞体的3…

SAP ABAP ME23N打印预览允许打印

简介: 用户希望PO创建成功时邮件发送打印模板,平时可以通过ME23N打印预览进行打印 实现:ME23N标准打印使用的是Scriptform函数ME_PRINT_PO调用子例程prepare_formular打开FORM,所以在这个子例程OPEN_FORM前的增强点做增强增强内容:IF p_screen NE space .xdialog = X.xde…