第一步:在根目录下创建一个common文件夹,在这个文件夹里面创建一个request.js文件,在这个文件里面呢,进行我们API   promise的实现。

const baseUrl = 'http://oa.9yuecloud.com:3333/api'
const sendRequest = (params) => {console.log(params); return new Promise((resolve, reject) => {wx.request({url: baseUrl + params.url,method: params.method || 'GET',data: params.data || '',success: res => {console.log(res);resolve(res)},fail: err => {reject(err)}})})
}export default sendRequest

第二步:引入该API promise方法,传入对应的参数即可

// index.js
/// 引入request.js
import sendRequest from '../../common/request'Page({// 发起登录接口请求handleGetLogin() {sendRequest({method: 'POST',url: '/users/login',data: { userName: 'admin', userPwd: '123456' }}).then(res => {console.log(res);}).catch(err => {console.log(err);})},/*** 页面的初始数据*/data: {},/*** 生命周期函数--监听页面加载*/onLoad: function (options) {},/*** 生命周期函数--监听页面初次渲染完成*/onReady: function () {},/*** 生命周期函数--监听页面显示*/onShow: function () {},/*** 生命周期函数--监听页面隐藏*/onHide: function () {},/*** 生命周期函数--监听页面卸载*/onUnload: function () {},/*** 页面相关事件处理函数--监听用户下拉动作*/onPullDownRefresh: function () {},/*** 页面上拉触底事件的处理函数*/onReachBottom: function () {},/*** 用户点击右上角分享*/onShareAppMessage: function () {}
})

最后呢,大家也发现了,我们在使用.then  .catch写法上呢,看着很复杂,那么这个时候呢,我们就可以使用es6给我们提供的终极方案,也就是async  和  await   来简化我们的代码。

// index.js
/// 引入request.js
import sendRequest from '../../common/request'Page({// 发起登录接口请求async handleGetLogin() {const res = sendRequest({method: 'POST',url: '/users/login',data: { userName: 'admin', userPwd: '123456' }})console.log(res);},/*** 页面的初始数据*/data: {},/*** 生命周期函数--监听页面加载*/onLoad: function (options) {},/*** 生命周期函数--监听页面初次渲染完成*/onReady: function () {},/*** 生命周期函数--监听页面显示*/onShow: function () {},/*** 生命周期函数--监听页面隐藏*/onHide: function () {},/*** 生命周期函数--监听页面卸载*/onUnload: function () {},/*** 页面相关事件处理函数--监听用户下拉动作*/onPullDownRefresh: function () {},/*** 页面上拉触底事件的处理函数*/onReachBottom: function () {},/*** 用户点击右上角分享*/onShareAppMessage: function () {}
})

微信小程序API promise的实现相关推荐

  1. 微信小程序——API promise化,全局数据共享,MobX,将Stroe中的成员绑定到页面中,在页面上使用Strore中的成员

    一.API promise化 1.基于回调函数的异步 API 的缺点 默认情况下,小程序官方提供的异步 API 都是基于回调函数实现的,例如,网络请求的 API 需要按照如下的方式调用: 缺点:容易造 ...

  2. 微信小程序api接口调用用封装

    微信小程序api接口调用用封装 1. 在 02-项目 下新建request目录及index.js文件 1.1 02-项目\request\index.js 1.2.index.js // 同时发送异步 ...

  3. PbootCMS微信小程序API的封装使用教程

    PbootCMS微信小程序API的封装使用教程 原文网址:https://www.lkcms.top/rgcms/58.html 第一步:准备md5加密文件 PbootCMS的签名参数signatur ...

  4. 微信小程序 api 缓存方案

    微信小程序 api 缓存方案 背景 前言 缓存方案(更新策略) 缓存那些接口 Storage 缓存工具类 ApiCache 类实现 配置 封装 request 请求 总结 背景 为了应对用户流量大,减 ...

  5. 微信小程序使用Promise

    微信小程序使用Promise,其实只需要在API方法外层包一个promise就行了. 本文以微信登陆和获取用户信息接口为例. 封装代码:wechat.js /*** Promise化小程序接口*/ c ...

  6. 微信小程序引入promise报错

    微信小程序引入 promise 相关库及 Android 真机报错解决方案 如果你恰巧使用的是 bluebird ,又恰巧你只是在模拟器上测试或者你的真机是iOS系统,你有必看看到最后,因为在Andr ...

  7. 微信小程序api概述

    微信小程序api概述 1.api 1.1 网络api 1.2 缓存api 1.3 界面api 2 开放能力-获取用户信息 2.1 通过API获取用户信息 3 图片与文件 3.1 下载图片 3.2 上传 ...

  8. 小程序 长按api_微信小程序API相关知识科普

    微信小程序API(Application Programming Interface),即应用程序编程接口.API是一种接口函数,把函数封装起来,给开发者,这样好多的功能就不需要你去实现了,只要会调用 ...

  9. 微信小程序上传接口php,微信小程序API 上传、下载

    微信小程序API 上传.下载 wx.uploadFile(OBJECT) 将本地资源上传到开发者服务器.如页面通过 wx.chooseImage 等接口获取到一个本地资源的临时文件路径后,可通过此接口 ...

最新文章

  1. Linux shell编程学习实例与参数分析(一)
  2. 【数据库】MySQL乱码解决(存入数据乱码和查询输出乱码)
  3. 5kyu Square sums (simple)
  4. Google、Azure、阿里云、RedHat…全球的 K8s 圈大佬聚在一起要聊啥?
  5. 使用jquery获取radio的值
  6. java returnAddres_JavaClient 查询ES-(重要)
  7. 删掉一个文件夹相对于另一个文件夹多出的文件
  8. c++如何打印一维数组首地址_C语言之二维数组和指针的结合
  9. 家长必看 父母须知孩子社交圈九要点(组图)
  10. STM32 4*4矩阵按键
  11. Nodejs cqmanager项目
  12. android仿bilibili ui,android指纹识别、拼图游戏、仿MIUI长截屏、bilibili最美创意等源码...
  13. Yii2数据库操作的各种写法
  14. 计算机硬件课题,计算机硬件技术基础免试课题.pptx
  15. 怎么用dos系统进入服务器,如何进入dos系统(非常实用的几个DOS使用技巧)
  16. Excel常用公式大全
  17. 壹号本 深度 linux,壹号本4代迷你笔记本开箱,10.1英寸大小,平板电脑二合一设计...
  18. Wi-Fi Mesh协议(1)
  19. 关于计算机技术的报纸,报社电子计算机中心
  20. python类的简单定义

热门文章

  1. 住院管理系统数据库课程设计
  2. Push rejected by evil dragon bureaucrats
  3. 拓嘉辰丰电商:拼多多店铺SUK如何设置
  4. 8.1 幽灵(no.21-no.30)
  5. 高桥盾react和boost_热门对比丨React pk Boost,你更偏向哪一双?
  6. 作文 我眼中的计算机1000字,我眼中的“怪人”(1000字)作文
  7. 晋城一中oj 议员秘密
  8. 图解 Panda3D引擎开发入门
  9. Not creating XLA devices, tf_xla_enable_xla_devices not set 问题
  10. C语言数组讲解(1)一维数组的创建和初始化。