小程序接口的封裝

項(xiàng)目根目錄新建文件夾

本文新建文件夾為http

封裝開(kāi)發(fā)環(huán)境文件

在http文件夾中新建文件env.js

module.exports={
?//開(kāi)發(fā)環(huán)境
?dev:{
???baseUrl:'http://192.168.0.11:8088'
?},
?//生產(chǎn)環(huán)境
?prod:{
???baseUrl:'https://**********.com/'
?},
?//測(cè)試環(huán)境
?test:{
???baseUrl:'https://**********.com/'
?}
}

封裝ajax

在http文件夾中新建文件request.js

具體配置可根據(jù)自己項(xiàng)目進(jìn)行調(diào)整

//?引入開(kāi)發(fā)環(huán)境
const?{?baseUrl?}?=?require('./env.js').dev

//?封裝ajax
module.exports?=?{
?request:?function?(url,?method?=?"GET",?data?=?{})?{
???let?fullUrl?=?${baseUrl}/${url};
???console.log('method',method,'data',data);
???wx.showLoading({
?????title:?'加載中',
???})
???return?new?Promise((resolve,?reject)?=>?{
?????wx.request({
???????url:?fullUrl,
???????method,
???????data,
???????header:?{
?????????'Content-type':?'application/x-www-form-urlencoded'
???????},
???????success(res)?{
?????????console.log('res::',res)
?????????if?(res.statusCode?===?200?&&?res.data.length?!=?0?||?res.data?!=?'')?{
???????????resolve(res.data)
???????????wx.hideLoading()
?????????}?else?{
???????????wx.showToast({
?????????????title:?'接口有問(wèn)題，請(qǐng)檢查',
?????????????icon:?"none"
???????????})
???????????reject('接口有問(wèn)題，請(qǐng)檢查1')
?????????}
???????},
???????fail(error)?{
?????????wx.showToast({
???????????title:?'數(shù)據(jù)接口有問(wèn)題',
?????????})
?????????reject('數(shù)據(jù)接口有問(wèn)題'?+?error)
???????}
?????})
???})
?}
}

封裝接口文件

在http文件夾中新建文件api.js

//?引入封裝好的ajax
const?{?request?}?=?require('./request.js');

//?封裝項(xiàng)目中用到的各種接口
module.exports?=?{
?//?wx登錄接口
?login:?(data)?=>?{
???return?request('signup/login',?'POST',?data,)
?},
?//?查找接口
?find:?(data)?=>?{
???return?request('register/find',?'POST',?data)
?},
?//?表單提交
?forms:?(data)?=>?{
???return?request('register/register',?'POST',?data)
?},
?//?更新接口
?update:?(data)?=>?{
???return?request('register/update',?'POST',?data)
?}
}

使用

首先需要在項(xiàng)目中引入封裝好的接口

const?{?login,?find,?forms?}?=?require('../../http/api.js')??//?根據(jù)需求引入接口

接著直接調(diào)用該接口即可

login(res).then(rs?=>?{
???console.log(rs)
})

find(res).then(rs?=>?{
???console.log(rs)
})

forms(res).then(rs?=>?{
???console.log(rs)
})