微信小步调开发中Promise的使用(aysnc,await)及场景分析

2024-11-3 11:23| 发布者: 8b79| 查看: 116| 评论: 0

摘要: 目次0.错误形貌1.分析2.办理方法2.1.使用await等待方法的实行，获取返回值2.2.使用链式调用.then()来处理promise3.成功获取0.错误形貌本日在开发中犯了一个比较严重的错误对于Promise的错误使用场景: 微信小步调

0.错误形貌

本日在开发中犯了一个比较严重的错误

对于Promise的错误使用

场景:

微信小步调中展示搜刮条件列表

[code]// 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)[/code]

猜猜会打印什么?

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

1.分析

[code]async[/code] 函数默认返回一个 [code]Promise[/code]，纵然你在 [code]async[/code] 函数中显式返回了值。

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

2.办理方法

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

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

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

[code]fetchTypelist() .then((typelist) => { console.log(typelist); }) .catch((error) => { console.error(error); });[/code]

3.成功获取

到此这篇关于微信小步调开发中Promise的使用(aysnc,await)的文章就先容到这了,更多相干微信小步调Promise使用内容请搜刮脚本之家从前的文章或继承欣赏下面的相干文章希望各人以后多多支持脚本之家！

来源：https://www.jb51.net/javascript/328969atl.htm
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！

收藏分享邀请

上一篇：JavaScript自定义localStorage监听事故的解决方法下一篇：vue项目纯前端实现的模板打印功能示例代码

账号		自动登录	找回密码
密码			立即注册