1. 程式人生 > >微信小程式 封裝介面

微信小程式 封裝介面

1.util-util.js

//封裝介面
let baseURL = 'http://127.0.0.1:3000/';   //介面路徑
let request = function (url, options = {}) {
  let myUrl = `${baseURL}${url}`;
  // 處理method,data,params=> 查詢字串
  // 如果有請求頭
  // 合併物件data
  // 如果params 新增查詢字串引數
  //介面的引數
  if (options.params) {
    let urlQueryString = qs.stringify(options.params, {   //使用到qs ,先下載,後引入
      addQueryPrefix: true,
      allowDots: true, 
    });
    myUrl += urlQueryString;
  }

  return new Promise((resolve, reject) => {
    wx.showLoading({
      title: '玩命載入中...',
    });
    wx.request({
      method: 'get',
      url: myUrl,
      success: resolve,
      fail: reject,
      complete: wx.hideLoading,
      ...options  //直接展開
    });
  });
}

  2.引入qs

const  qs= require('../static/js/qs.js');

3.將這個介面暴露出去

module.exports = {
  formatTime: formatTime,
  request:request
}

 4.在app.js引進工具物件,便於其他頁面使用

const { request, formatTime }=require('./utils/util.js');
//向外提供屬性
  globalData: {
    userInfo: null,
    formatTime,
     request
  }

5.先 在請求的頁面引入,使用 async  await

引入

//解構賦值
const  { request } =getApp().globalData;

使用 async  await

 let swipe = await request('slides', {
      method: 'get',
      params: {
        a: 1, b: 2
      },
    });