微信小程序API promise的实现
第一步:在根目录下创建一个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的实现相关推荐
- 微信小程序——API promise化,全局数据共享,MobX,将Stroe中的成员绑定到页面中,在页面上使用Strore中的成员
一.API promise化 1.基于回调函数的异步 API 的缺点 默认情况下,小程序官方提供的异步 API 都是基于回调函数实现的,例如,网络请求的 API 需要按照如下的方式调用: 缺点:容易造 ...
- 微信小程序api接口调用用封装
微信小程序api接口调用用封装 1. 在 02-项目 下新建request目录及index.js文件 1.1 02-项目\request\index.js 1.2.index.js // 同时发送异步 ...
- PbootCMS微信小程序API的封装使用教程
PbootCMS微信小程序API的封装使用教程 原文网址:https://www.lkcms.top/rgcms/58.html 第一步:准备md5加密文件 PbootCMS的签名参数signatur ...
- 微信小程序 api 缓存方案
微信小程序 api 缓存方案 背景 前言 缓存方案(更新策略) 缓存那些接口 Storage 缓存工具类 ApiCache 类实现 配置 封装 request 请求 总结 背景 为了应对用户流量大,减 ...
- 微信小程序使用Promise
微信小程序使用Promise,其实只需要在API方法外层包一个promise就行了. 本文以微信登陆和获取用户信息接口为例. 封装代码:wechat.js /*** Promise化小程序接口*/ c ...
- 微信小程序引入promise报错
微信小程序引入 promise 相关库及 Android 真机报错解决方案 如果你恰巧使用的是 bluebird ,又恰巧你只是在模拟器上测试或者你的真机是iOS系统,你有必看看到最后,因为在Andr ...
- 微信小程序api概述
微信小程序api概述 1.api 1.1 网络api 1.2 缓存api 1.3 界面api 2 开放能力-获取用户信息 2.1 通过API获取用户信息 3 图片与文件 3.1 下载图片 3.2 上传 ...
- 小程序 长按api_微信小程序API相关知识科普
微信小程序API(Application Programming Interface),即应用程序编程接口.API是一种接口函数,把函数封装起来,给开发者,这样好多的功能就不需要你去实现了,只要会调用 ...
- 微信小程序上传接口php,微信小程序API 上传、下载
微信小程序API 上传.下载 wx.uploadFile(OBJECT) 将本地资源上传到开发者服务器.如页面通过 wx.chooseImage 等接口获取到一个本地资源的临时文件路径后,可通过此接口 ...
最新文章
- Linux shell编程学习实例与参数分析(一)
- 【数据库】MySQL乱码解决(存入数据乱码和查询输出乱码)
- 5kyu Square sums (simple)
- Google、Azure、阿里云、RedHat…全球的 K8s 圈大佬聚在一起要聊啥?
- 使用jquery获取radio的值
- java returnAddres_JavaClient 查询ES-(重要)
- 删掉一个文件夹相对于另一个文件夹多出的文件
- c++如何打印一维数组首地址_C语言之二维数组和指针的结合
- 家长必看 父母须知孩子社交圈九要点(组图)
- STM32 4*4矩阵按键
- Nodejs cqmanager项目
- android仿bilibili ui,android指纹识别、拼图游戏、仿MIUI长截屏、bilibili最美创意等源码...
- Yii2数据库操作的各种写法
- 计算机硬件课题,计算机硬件技术基础免试课题.pptx
- 怎么用dos系统进入服务器,如何进入dos系统(非常实用的几个DOS使用技巧)
- Excel常用公式大全
- 壹号本 深度 linux,壹号本4代迷你笔记本开箱,10.1英寸大小,平板电脑二合一设计...
- Wi-Fi Mesh协议(1)
- 关于计算机技术的报纸,报社电子计算机中心
- python类的简单定义
热门文章
- 住院管理系统数据库课程设计
- Push rejected by evil dragon bureaucrats
- 拓嘉辰丰电商:拼多多店铺SUK如何设置
- 8.1 幽灵(no.21-no.30)
- 高桥盾react和boost_热门对比丨React pk Boost,你更偏向哪一双?
- 作文 我眼中的计算机1000字,我眼中的“怪人”(1000字)作文
- 晋城一中oj 议员秘密
- 图解 Panda3D引擎开发入门
- Not creating XLA devices, tf_xla_enable_xla_devices not set 问题
- C语言数组讲解(1)一维数组的创建和初始化。