1.在项目根目录下,新建一个request文件夹
2.在request文件夹中新一个一个request.js文件用于封装wxrequest方法
//这个页面就是封装了requsst什么都不用动,放着就行
//单纯把wx.request 封装
function request(params) {
//promise 解决 异步编程运行顺序的问题
return new Promise(function (resolve,reject) {
wx.request({
url:params.url,
data:params.data || {},
header:params.header || {},
method:params.method || "GET",
dataType:"json",
success(res){
resolve(res.data)
},
fail(err){
reject(err)
}
})
})
}
module.exports = {
req:request
}
3.在request文件夹中新一个api.js文件用于设置url服务,设置接口路径,开发接口
//开发服务器
let url = "http://kumanxuan1.f3322.net:8001/";
//测试服务器
//let url = "http://www.ceshi.com";
//上线服务器
//let url = "http://www.dashanpao.com";
//设置每一个接口的路径
// const 自己命名的api名=url+'后端给的接口名'
const indexApi=url+'/index/index';
// 将接口开放出去,给fetch.js引用
module.exports = {
// newApi
indexApi
}
4.在request文件夹中新建一个fetch.js
// 这个页面中的内容也不用管
let api = require("./api.js");
let request = require("./request.js");
//整合 路径 和 请求函数
function getIndex() {
return request.req({
url:api.indexApi
})
}
// 将请求函数开放出去
module.exports = {
// getNew
getIndex
}
5.使用接口函数
// index.js
// ========================================================引入接口文件
const fetch = require("../../request/fetch.js");
Page({
data: {
},
// 事件处理函数
onLoad() {
// ==================================================使用getIndex()方法
fetch.getIndex().then(res=>{
console.log(res);
})
},
})
6.成功展示:
如果不好使请 点击详情,勾选不校验合法域名
7.这回真的成功了
在get请求中传入参数
1.在fetch.js文件中封装的请求中添加 data:params
// 这个页面中的内容也不用管
let api = require("./api.js");
let request = require("./request.js");
//整合 路径 和 请求函数
function getIndex() {
return request.req({
url:api.indexApi,
})
}
// 3.--------------------写一个请求方法
function getTopicList(params){
return request.req({
url:api.topiclistApi,
// 要传参数的请求可以加上data:params++++++++++++
data:params
// +++++++++++++++++看这里+++++++++++++++++++++++++++
})
}
//4.----------------------- 将请求函数开放出去
module.exports = {
// getNew
getIndex,
getTopicList
}
2.在要使用请求的js文件中的请求方法中写入{键:值,键:值}
// pages/topic/topic.js
const fetch = require("../../request/fetch.js");
Page({
/**
* 页面的初始数据
*/
data: {
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
this.getTabBar().setData({
active: 1,
})
// 在请求方法中可添加要发送给接口的数据===================
fetch.getTopicList({page:1,size:5}).then(res=>{
// =========================看这里========================
console.log(res);
})
},
})