微信小程序> 小程序使用promise

小程序使用promise

浏览量:3959 时间: 来源:游川鱼

小程序使用promise


现在小程序已经支持promise了,但它的API使用的是callback,如何用promise封装呢?这是本人在项目中的封装方式,给大家提供一点参考。

先在utils下创建一个request.js文件,代码如下:

// /utils/request.jsconst app = getApp();const baseUrl =  app.globalData.url;const headerConfig = {  "Content-Type": "application/json",}// 这是一个通用的方式,所有的异步都能用这个,但是不方便,每次使用时obj的参数很重复export function wxPromise(fn) {  return function(obj = {}) {    return new Promise((resolve, reject) => {      obj.success = res => {        resolve(res)      };      obj.fail = res => {        reject(res)      };      fn(obj)    })  }}// 这是对post请求的封装export function post(url, data={}){  return new Promise((resolve, reject) => {     //网络请求     wx.request({        url:  baseUrl  + url,        data,        method: 'POST',        header:headerConfig,        success: function (res) {//服务器返回数据          resolve(res);        },        fail: function (error) {          reject(error);        }     })  });}// 这是对get请求的封装export function get(url, data={}){  return new Promise((resolve, reject) => {     //网络请求     wx.request({        url:  baseUrl  + url,        data,        method: 'GET',        header:headerConfig,        success: function (res) {//服务器返回数据          resolve(res);        },        fail: function (error) {           reject(error);        }     })  });}

项目中主要是使用wx.request的get和post请求,为了方便就单独定义两个方法。

使用方式非常简单:

// 先用import将方法引入import { get, wxPromise} from "../../utils/request";getToken () {  if(!token) {  // 注意wxPromise(wx.login)返回的是一个方法,调用这个返回的方法才是我们要的promise对象    wxPromise(wx.login)()    .then(res =>  get("/auth/getToken", {jscode: res.code})    .then(res => { // 这里进行数据操作 })  }}

上面这个例子中,如果不使用get方法,其实也是可以的

// 先用import将wxPromise方法引入import { wxPromise} from "../../utils/request";const app = getApp();getToken () {  if(!token) {  // 注意wxPromise(wx.login)返回的是一个方法,调用这个返回的方法才是我们要的promise对象    wxPromise(wx.login)()    .then(res => wxPromise(wx.request)({    url: app.globalData.url + "/auth/getToken",    method: 'GET',    data: {}, // 这里放请求参数    header: { "Content-Type": "application/json"}    })    .then(res => { // 这里进行数据操作 })    })  }}

版权声明

即速应用倡导尊重与保护知识产权。如发现本站文章存在版权问题,烦请提供版权疑问、身份证明、版权证明、联系方式等发邮件至197452366@qq.com ,我们将及时处理。本站文章仅作分享交流用途,作者观点不等同于即速应用观点。用户与作者的任何交易与本站无关,请知悉。

  • 头条
  • 搜狐
  • 微博
  • 百家
  • 一点资讯
  • 知乎