wx小程序知识点（三）

三、封装小程序的数据请求

（1）在根目录创建utils目录，创建config.js、base.js

（2）在config.js中创建config类，并将请求路径配置给config的属性restUrl，并export

class Config {
  constructor () {}
}

Config.restUrl = 'http://***.cn/api/v1/'

export { Config }

（3）在base.js中引入config，把url赋值给base的属性

import { Config } from 'config.js'

class Base {
  constructor() {
    this.baseRequestUrl = Config.restUrl
  }
}

在 class Base 中封装request方法，只接受一个param 参数

request(params) {
    var url = this.baseRequestUrl + params.url
    if (!params.type) {
      params.type = 'GET'
    }
    wx.request({
      url: url,
      data: params.data,
      header: {
        'content-type':'application/json',
        'token': wx.getStorageSync('token')
      },
      method: params.type,
      success: function (res) {
        params.sCallback && params.sCallback(res.data)
      },
      fail: function (err) {

      },
      complete: function (res) {

      },
    })
  }

（4）在页面的 index.js 中，构建好params的结构后，直接调用Base.request(params)，例如

    var params = {
      url: 'banner/' + id,
      method: 'GET',
      sCallback:
　　　 　　(res) => {
　　　 　　　　//数据绑定
　　　　　 　　this.setData({
　　　　  　　　　'bannerArr': res[0].item
　　      　　})
　　　  　　}
　　 }
    this.request(params)