微信小程序：wx.request请求封装，接口统一存放

有很多小伙伴在前面的文章中评论，问我封装的network的代码，下面就详细写下。

一、在项目根目录新建network文件夹，用于存放请求的文件。

二、在network文件夹下，新建base.js文件，用于存放域名和hearder等统一的信息：

module.exports = {
  baseUrl: 'https://www.xxxxx.com'
}

三、在network文件夹下，新建network.js文件，用于存放接口。以下以登录接口为例：

let { baseUrl } = require('./base.js')
export default class networkModule {
  /**
   * 登录
   * @param {Function} callback 
   */
  static login(params, callback) {
    var task = wx.request({
      url: baseUrl + '/Api/login',
      method: 'GET',
      header: {
        'content-type': 'application/json'
      },
      data: {
        code: params.code,
      },
      success(res) {
        //console.log(res)
        wx.showToast({
            title: res.data.msg,
            icon: 'none',
            duration: 2000
          });
        callback(res.data)
      },
      fail(res) {
        //console.log(res)
        wx.showToast({
          title: '服务器请求失败',
          icon: 'none',
          duration: 2000
        });
        callback({ status: 400, msg: '网络错误' }, res);
      }
    })
    return task;
  }
}

四、在需要用到network的页面的js文件中，引用上面的network.js文件：

import NetWork from './network/network'

五、在需要用到network的页面的js文件中，如何使用上面封装的login请求方法呢？看下面的例子：

getToken: function(){
    //参数
    let params = {
      code: ''
    }
    //请求
    NetWork.login(params, (res, err) => {
      if (err || res.code === 0) {
        return;
      }
      //返回成功的操作
      this.token = res.token;
    })
  },

六、在发出请求前，也就是上面NetWork.login方法执行之前，可以在页面增加loading效果或者按钮置灰，防止用户的多次操作，导致多次触发请求。在接收到请求返回之后，也就是上面NetWork.login方法执行返回后，按照需求需要，关闭loading效果或者恢复按钮点击事件。我上面的代码没有具体说明，可以自己适当添加哦~

还有没考虑周全的地方，希望大家能评论指出