利用Promise封装原生小程序wx.request

先记录一下自用基础版本，防止自己后续忘了。
小程序官方文档可以看这里 wx.request

官方示例：

wx.request({
  url: 'example.php', //仅为示例，并非真实的接口地址
  data: {
    x: '',
    y: ''
  },
  header: {
    'content-type': 'application/json' // 默认值
  },
  success (res) {
    console.log(res.data)
  }
})

用起来还是比较麻烦的，我又不想一个个到处复制粘贴的使用，看上去也不够简洁，所以就利用Promise封装了一下，话不多说，直接上代码！

封装 request.js

  /**
      request.js
     * url - 请求地址
     * method - 请求方式
     * data - 请求参数的配置对象
     * header - 请求头的配置对象
 */
  var app = getApp(); //引入全局app.js，我们可以在globalData中定义一些公用的数据，比如baseUrl、token
  module.exports = function ({
    url,
    method,
    data,
    header = {}
  }) {
    return new Promise((resolve, reject) => {
      const token = wx.getStorageSync('token')
      if (token) {
        wx.request({
          url: app.globalData.baseUrl + url,
          method,
          data: method == "GET" ? data : JSON.stringify(data),
          header: {
            'Authorization': token, //这里可以根据业务需求决定是否保留
            ...header
          },
          success: (res) => {
            if (res.statusCode === 200) {
              if (res.data.code !== 200) {
                wx.showToast({
                  title: res.data.msg,
                  icon: 'none',
                })
                reject(res.data.msg)
              } else if (res.data.code == 401) {
                try {
                  wx.setStorageSync('token', "");
                } catch (e) {}
              } else {
                resolve(res.data)
              }
            } else {
              wx.showToast({
                title: res.data.error,
                icon: 'none',
              })
              reject(res.data.error)
            }
          },
          fail: (err) => {
            reject(err)
          }
        })
      } else {
        wx.showToast({
          title: "登录信息不存在或已失效，请重新登录！",
          icon: 'none',
        })
      }
    })
  }

使用

创建跟app.js同级目录的api文件夹统一管理所有的接口

api/team.js

const request = require("../utils/request") //引入封装好的js文件
module.exports = {
  // 团队详情信息
  getTeamDetailsApi(tid) {
    return request({
      url: '/team/teamDetails/' + tid,
      method: "get",
    })
  },
  // 退出团队
  exitTeamaApi(data) {
    return request({
      url: '/team/exitTeam',
      method: "post",
      data
    })
  },
}

pages/teamDetails/teamDetails.js