支付宝小程序请求封装

  • pages同级目录utils下创建request.js
    支付宝小程序请求封装_第1张图片

request.js

let app = getApp()
export function request(config) {
  // 加载loading
  my.showLoading({
    content: '加载中...'
  });

  let host = app.globalData.host;
  // 解构赋值
  let {
    url = '',
    data = {},
    method = 'POST'
  } = { ...config }

  return new Promise((resolve, reject) => {
    my.request({
      url: host + url,
      method: method,
      data: { ...data },
      success: (res) => {
        resolve(res.data)
      },
      fail: (err) => {
        reject(err)
      },
      complete: () => {
        setTimeout(()=> {
          my.hideLoading();
        }, 400)
      }
    });
  })
}
  • 在pages同级创建api文件夹, 文件夹中存放不同模块的api文件
    支付宝小程序请求封装_第2张图片
    index.js
import { request } from '../utils/request'

export const getBookList = (data) => {
    return request({
        url: '/api/book/index',
        method: 'POST',
        data
    })
}
  • 在页面中引用
import { getBookList } from '../../api';
Page({
  data: {
  
  },
  onLoad(query) {
    // 页面加载
    console.info(`Page onLoad with query: ${JSON.stringify(query)}`);
  },
  onReady() {
    // 页面加载完成
    getBookList({
      "page": 1,
      "limit": 5
    }).then(res => {
      console.log(res);
    }).catch(err => {

    })
  }
});

你可能感兴趣的:(小程序记录)