步骤
1.新建utils文件夹（微信小程序自带），在utils下创建base.js（名字可以由自己来定）。
2.封住代码
.`class Base {
constructor() {
this.baseRequestUrl = “http://123.cn/” //封装服务器接口路径，方便修改
}
reuqest(params) { //将所有request中需要用到的放进params参数中
var url = this.baseRequestUrl + params.url; //构造完整接口路径
if (!params.type) { //判断请求方式如果为空即默认让它为GET请求
params.type = ‘GET’;
}
wx.request({
url: url,
data: params.data,//请求的数据为默认
header: {
‘content-type’: ‘application/json’,
‘token’: wx.getStorageSync(‘token’)
},
method: params.type,
success: function(res) {
params.sCallback && params.sCallback(res) //sCallback为回调函数为了解决异步请求结果
},
fail: function(err) {
}
})
}
}
export {Base} //抛出Base类`
3.去需要请求数据新建页面
例：
4.在request-model.js文件中`import {
Base
} from ‘…/…/utils/base.js’ //导入封装request的Base类
class Home extends Base { //继承类
constructor() { //创建构造函数以防报红
super();
}
getBannerData(id, callBack) { //id ，callBack为参数作为传递
var params = {
url: ‘banner/’ + id,
sCallback: function(res) { //回调函数接受res结果
callBack && callBack(res.items)
}
}
}
}
export {
Home
};
5.// requestPackage/request/request.js
import {
Home
} from ‘request-model.js’; //导入类
var home = new Home(); //实例化类名
Page({
/**
- 页面的初始数据
*/
data: {
},
/**
- 生命周期函数–监听页面加载
*/
onLoad: function(options) {
this._loadData() //页面加载时调用请求数据
},
_loadData: function() {
var id = 1;
home.getBannerData(id, (res) => { //用home类下的getBannerData请求
console.log(res);
//接下来直接数据绑定
this.setData({
banner: res
})
})
},
})`
好了完成！