在微信小程序中封装一个网络请求方法文件

Posted 2020-12-21 hthq1234

当我们在微信小程序中想进行一个网络请求时，假如我们有很多个Page页面都需要进行网络请求，我们在每个这些Page页面的js文件中都使用wx.request这个api进行请求的话，假如有一天微信小程序突然废弃或修改了这个api的话，那么我们就需要去这些文件里面一个个进行修改，可想而知是多么的繁琐，所以我们就很有必要去独立封装一个网络请求的方法，就算到时候这个api被废弃和修改，我们也只需要去这一个封装好的文件里修改部分代码就可以了。

export default function request(options){
  return new Promise((resolve,reject)=>{
    wx.request({
      url: options.url,
      method:options.method || ‘get‘,
      data:options.data || {},
      success:function(res){
        resolve(res)
      },
      fail:function(err){
        reject(err)
      }
    })
  })
}
更加简便的写法：
export default function request(options){
  return new Promise((resolve,reject)=>{
    wx.request({
      url: options.url,
      method:options.method || ‘get‘,
      data:options.data || {},
      success:resolve,
      fail:reject
    })
  })
}

 

 这个是我们封装好的方法，通过return一个Promise，使用Promise来进行网络的异步请求，可以解决回调地狱的问题，其他文件通过export即可调用这个方法，例如在Page页面的onLoad生命周期的时候进行网络请求。

import request from ‘文件地址‘;
onLoad:function(options){
    // 使用封装的request发送网络请求
    // 使用Promise避免回调地狱
    request({
      url:‘要请求的地址‘
    }).then(res=>{
      console.log(res)
    }).catch(err=>{
      console.log(err)
    })
  }

 

通过then和catch进行回调获取信息。