微信小程序中封装wx.request请求

1.在根目录下新建 request/utils 文件夹，并新建request.js/index.js 文件

代码如下（示例）：

//当页面有多个请求时，定义一个变量
let times = 0

export default const request = (params) => {
  let baseUrl = "url地址";
  // 有请求时自增一次
  times++;
  // 请求数据时显示加载框
  wx.showLoading({
    title: '加载中',
    mask: true
  })
  // 返回一个Promise对象
  return new Promise((resolve, reject) => {
    wx.request({
      ...params,
      // 这里的url会将params参数中的url覆盖掉
      url: baseUrl + params.url, 
      // 成功时的回调函数
      success: (res) => {
        resolve(res.data)
      },
      // 失败时的回调函数
      fail: (err) => {
        reject(err)
      },
      // 不管成功或失败都会执行的回调函数
      complete: () => {
        // 当请求完成一个时，变量自减一次
        times--;
        // 直到变量的值为0时，所有请求加载完毕，关闭加载框
        if (times=== 0) {
          wx.hideLoading();
        }
      }
    })
  })
}

2.小程序页面中使用

代码如下（示例）：

import request from '@/utils/request'

Page({
  data:{
    list:[],
  },

  async getList() {
    const res = await request({
      url:'xxx',
      method:"GET"
    });
    this.setData({
      list: res,
    });
  }
})