微信小程序Request / 渔人

1年前 阅读 / 899 来源 / 原创 文 / 小酒馆

小程序Request封装,开箱即用。

小程序Request封装,开箱即用

主体文件:request.js

/**
 * @param {String} BASE_URL 请求域名
 */
const BASE_URL = 'https://xxx.com'

/**
 * 
 * @param {String} url API路径-实际请求地址 BASE_URL + url
 * @param {String} method 请求方式 - Get、Post、Put、Update、Detele
 * @param {*} data 请求参数
 * @param {Object} header 请求头配置
 */
module.exports = (url, method = 'GET', data, header = {}) => {
  return new Promise((resolve, reject) => {
    let requestHeader = {
      ...header
    }
    wx.request({
      url: BASE_URL + url,
      method,
      data,
      header: requestHeader,
      dataType: 'json',
      success: res => {
        if (res.statusCode === 200) {
          resolve(res.data)
        }
      },
      fail: reject
    })
  })
}

使用方法:

API请求方法统一整理,方便日后维护,在文件中引用request.js,将方法导出,方便在小程序页面调用

// 引入request.js
const request = require('request.js')

/**
 * 
 * @param {*} data 请求参数
 */
const login = (data) => {
  return request('/api/sys/login', 'post', data)
}

// 导出API方法
module.exports = {
  login
}

挂载API:

在小程序app.js文件挂载API方法

// 导入根据实际路径
const http = require('/utils/request.js')

App({
  http,
})

调用方法:

在需要使用API的页面,定义小程序全局对象

// 定义小程序全局方法
const app = getApp()

// 在需要使用的方法调用,参数在login传入
app.api.login().then(e=>{
   // 处理方法返回data
})

try {
    // await须与async配套使用
  let data = await app.api.login()
} catch (error) {
  // 处理异常
  console.log(error)
}


71

评论列表
共0条评论
  • 这篇文章还没有收到评论,赶紧来抢沙发吧~