文章目录
- 一、第一步(在小程序的目录下新建一个 api 的文件夹)
- 二、封装http.js
- 三、封装request.js
- 四、封装index.js
- 五、在需要调用的页面
一、第一步(在小程序的目录下新建一个 api 的文件夹)
http.js:存放公共服务器地址
index.js:存放api请求地址
request.js:存放封装的api请求
二、封装http.js
let baseUrl = 'http://127.8.1.1';
export {
baseUrl
}
三、封装request.js
import { baseUrl } from './http.js'
module.exports = {
request : function(url, methodType, data){
let fullUrl = `${baseUrl}${url}`
// let token = wx.getStorageSync('token') ? wx.getStorageSync('token') : ''
//(wx.showLoading)显示 loading 提示框。需主动调用 wx.hideLoading 才能关闭提示框
wx.showLoading({ title: "数据请求中" });
return new Promise((resolve,reject)=>{
wx.request({
url: fullUrl,
methodType,
data,
header: {
'content-type': 'application/json', // 默认值
// 'x-api-key': token,
},
success(res){
if (res.data.status == 200) {
resolve(res.data)
wx.hideLoading()
}else{
//手动关闭loading提示框
wx.hideLoading()
wx.showToast({
title: res.data.msg,
icon:'none'
})
reject(res.data.message)
}
},
fail(){
wx.showToast({
title: '接口请求错误',
icon:'none'
})
reject('接口请求错误')
}
})
})
}
}
四、封装index.js
import { request } from './request'
module.exports = {
// 获取请求接口
queryAddressList: (data) => request('/company/getlist', 'GET', data),
}
五、在需要调用的页面
// 引入 api 下的 index 文件
//注意引入路径
const api = require('../../api/index')
// 在方法中调用
goRegister(){
//参数data
let data = {
a: this.data.a,
b: this.data.b,
}
api.queryAddressList(data).then((res) => {
console.log(res,'res');
})
},