封装小程序的请求

对小程序官方的wx.request进行再次封装

最近在学习小程序的时候，学习到了对于官方的请求方法的再次封装

话不多说上代码

let times = 0
export const myRequest = (params) =>{
  times++
  wx.showLoading({
    title: '加载中',
    mask: true,
  })
  return new Promise((resolve,reject)=>{
    wx.request({
      ...params,
      success:(res)=>{
        resolve(res)
      },
      fail:(err)=>{
        reject(err)
      },
      complete:()=>{
        times--
        if(times===0){
           wx.hideLoading()
        }
      }
    })
  }).catch((error)=>{})
}

代码解释

• 声明times的意义是为了用于对发起请求进行计数，这样一个页面内同时发起多个请求时，不会产生动画的重复
• wx.showLoading和wx>hideLoading是小程序官方封装好的方法，可以让用户知道直接的请求是否成功，而放在complete中是因为，无论请求成功与否都会显示
• 在参数里面采用了扩展运算符，这样在使用的时候，只需要将params传入你的实参对象就行，对象内容直接根据官方文档配置就行。
• promise时最好加上catch方法,这样防止报错
• 通过export导出，使用的时候使用import from就行

代码使用

import {myRequest}  from './index.js'  //记得加上后缀

myRequest({
  url:'',
  data:'',//根据实际配置就行
})


/***  推荐使用async,await写法  *****/
/*** 使用该方法，现在不要引用相关包了，直接点开开发者工具右上角的详情，找到本地配置，勾选增强编译即可 ***/
async onLoad(){
  let obj = {}  //你的配置对象
  let res = await myRequest(obj) //res就是你通过上面Promise.resolve()返回出来的数据
}