小程序知识点

在开发小程序的时候免不了要向后台发送接口请求，如果每次都用wx.request，代码量会大大增加，要知道小程序现在最大不能超过2m，所以将发送请求的封装在一个公共类函数中

结构如下：

封装的request请求：

var request = {  
  /**
   * 请求接口方法
   * @param{url}请求url
   * @param{method} 请求方式
   * @param{data} 请求参数
   */
  momoRequest(url, method, data) {

    method = method || "GET";
    method = method.toUpperCase(); //转化为大写
    
    return new Promise((resolve, reject) => {
      wx.request({
        url: url,
        method,
        data,
        success: function (res) {
          if (res.statusCode != 200) {
            reject({ error: '服务器忙，请稍后重试', code: 500 });
            return;
          }
          let apiRes = res.data;
          if (apiRes.code != 200) {
            let msg = apiRes.message ? apiRes.message : '接口请求错误';
            let code = apiRes.code ? apiRes.code : 500;
            reject({error: msg, code: code});
            return;
          }
          resolve(apiRes.data);
        },
        fail: function (err) {
          reject({ error: '网络错误', code: 0 });
        }
      });
    })
  }
}

暴露函数：

//导出方法类
module.exports = {
  request: request
}

根据es6语法，应用回调函数Promise，return接口返回数据

在page页面的js中应用：

先引用函数：

//引入工具类
import * as momo from "../utils/util.js";

调用函数：

//接口请求
    momo.request.momoRequest(url, 'GET', data).then(
      function(data) {
        console.log(data);
      },
      function(err) {
        console.log(err);
      }

---恢复内容结束---

结构如下：

封装的request请求：

var request = {
  
  /**
   * 请求接口方法
   * @param{url}请求url
   * @param{method} 请求方式
   * @param{data} 请求参数
   */
  momoRequest(url, method, data) {

    method = method || "GET";
    method = method.toUpperCase(); //转化为大写
    
    // console.log("接口请求: " + url + " method:" + method);

    return new Promise((resolve, reject) => {
      wx.request({
        url: url,
        method,
        data,
        success: function (res) {
          if (res.statusCode != 200) {
            reject({ error: '服务器忙，请稍后重试', code: 500 });
            return;
          }
          let apiRes = res.data;
          if (apiRes.code != 200) {
            let msg = apiRes.message ? apiRes.message : '接口请求错误';
            let code = apiRes.code ? apiRes.code : 500;
            reject({error: msg, code: code});
            return;
          }
          resolve(apiRes.data);
        },
        fail: function (err) {
          reject({ error: '网络错误', code: 0 });
        }
      });
    })
  }
}

暴露函数：

//导出方法类
module.exports = {
  request: request
}

根据es6语法，应用回调函数Promise，return接口返回数据

在page页面的js中应用：

先引用函数：

//引入工具类
import * as momo from "../utils/util.js";

调用函数：

//接口请求
    momo.request.momoRequest(url, 'GET', data).then(
      function(data) {
        console.log(data);
      },
      function(err) {
        console.log(err);
      }

猜你喜欢