微信小程序网络请求封装示例

以下是“微信小程序网络请求封装示例”的详细攻略：

什么是网络请求封装？

由于微信小程序不支持引入第三方库和框架，所以通常我们需要封装一些网络请求相关的方法，使其可以在不同的页面和模块中使用，避免重复编写代码。对于这种情况，我们可以将一些常用的网络请求方法进行封装，然后在需要的地方进行调用。网络请求封装可以提高开发效率，减少代码量。

封装网络请求方法

下面是一个基本的网络请求方法示例：

const request = (url, method, data) => {
  return new Promise((resolve, reject) => {
    wx.showLoading({
      title: '加载中...',
      mask: true
    })
    wx.request({
      url,
      method,
      data,
      success: (res) => {
        resolve(res.data)
      },
      fail: (err) => {
        reject(err)
      },
      complete: () => {
        wx.hideLoading()
      }
    })
  })
}

module.exports = {
  request
}

这里的 request 方法接收三个参数（url，method，data），使用 Promise 对象封装了 wx.request 方法，并在请求前显示了一个加载提示，请求完成后隐藏加载提示。

使用封装的网络请求方法

接下来我们来看一下如何使用封装的网络请求方法：

1. 首先在需要使用的页面或工具类中引入 request 方法：

const { request } = require('网络请求.js')

1. 然后，在需要进行网络请求的地方进行如下调用：

request('http://www.example.com/api', 'GET', { data: 'example' })
  .then((res) => {
    console.log(res)
  })
  .catch((err) => {
    console.error(err)
  })

在这个例子中，我们使用 GET 方法请求了 http://www.example.com/api 接口，并传递了一个名为 data 的参数。请求完成后，根据是否成功，成功时会打印后台返回数据（通过 then 方法），失败时会打印错误信息（通过 catch 方法）。

1. 另一个示例

在需要发送一个POST请求的地方，使用封装的网络请求方法也很简单：

request('http://www.example.com/api', 'POST', { data: 'example' })
  .then((res) => {
    console.log(res)
  })
  .catch((err) => {
    console.error(err)
  })

和 GET 请求类似，这里的 POST 请求仅仅是将第二个参数改为了 POST，并且设置了传递的参数。需要注意的是，在实际开发中，应该根据需要进行参数的加密或编码。

总结

上面的示例演示了如何使用 Promise 对象对 wx.request 方法进行封装，以及如何在需要用到网络请求的地方进行调用。实际开发中，根据项目的需要，可以对封装过程进行改进，提高性能、提高可读性等。通过网络请求的封装，可以在开发中提高开发效率，提高代码复用率，使代码更易于维护。