小程序 HTTP请求封装

  • 定义http.js
// http,promise封装
import {
  config
} from "../config"

const tips = {
  1001: ‘参数错误‘,
  1002: ‘json格式不正确‘,
  1003: ‘找不到资源‘
}

class Http {
  constructor() {
    this.baseUrl = config.api_url
  }
  request({
    url,
    data = {},
    method = ‘GET‘
  }) {
    return new Promise((resolve, reject) => {
      wx.request({
        url: this.baseUrl + url,
        data,
        method,
        header: {
          ‘content-type‘: ‘application/json‘,
          ‘appkey‘: config.appkey
        },
        success: res => {
          const code = res.statusCode.toString()
          if (code.startsWith(‘2‘)) {
            resolve(res.data);
          } else {
            reject()
            const error_code = res.data.error_code
            this._show_error(error_code)
          }
        },
        fail: err => {
          reject()
          this._show_error(1)
        }
      });
    })
  }
  _show_error(error_code) {
    if (!error_code) {
      error_code = 1
    }
    const tip = tips[error_code]
    wx.showToast({
      title: tip ? tip : tips[1],
      icon: ‘none‘,
      duration: 2000
    })
  }

}


export {
  Http
}
  • 在数据模型中使用
import {
  Http
} from "./http"

class CatetoryModel extends Http {
  getList(type) {
    return this.request({
      url: ‘/category‘,
      data: {
        type
      }
    })
  }
}

export {
  CatetoryModel
}
  • 在页面中使用
import { CatetoryModel } from "./models/category"
const catetoryModel = new CatetoryModel()
Page({
  async getCategorytList() {
    let catetorys = await catetoryModel.getList()
    this.setData({ catetorys })
  }
})

小程序 HTTP请求封装

上一篇:微信小程序之保持登录状态即session不改变


下一篇:小程序-自定义模态框弹框