本文小编为大家详细介绍“Request网络请求如何封装”,内容详细,步骤清晰,细节处理妥当,希望这篇“Request网络请求如何封装”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。
首先我们来看一下官方文档中介绍的wx.request()
默认使用方式
wx.request({
url: 'test.php', //仅为示例,并非真实的接口地址
data: {},
header: {
'content-type': 'application/json' // 默认值
},
success: function(res) {
console.log(res.data)
}
})
Request.js是基于WX API的封装只有一个文件
const URL = 'http://love520.com'
module.exports = {
//封装request方法,第一个参数请求地址,第二个参数传递参数,第三个参数请求方式
request:function(url,data={},method){
//返回promise对象 resolve 成功的回调方法 reject失败的回调方法 一旦发生就不会改变
return new Promise((resolve, reject)=>{
wx.request({
url: URL + url,
data,
method,
header:{
'token':wx.getStorageSync('token')
},
success:(res)=>{
if(res.statusCode === 200 && res.data.code === 200){
resolve(res.data)
wx.hideLoading()
} else {
wx.showToast({
icon:'error',
title: res.Msg,
})
reject(res.Msg)
}
},
fail:(err)=>{
wx.showToast({
icon:'error',
title: '接口无响应',
})
reject('接口无响应')
}
})
})
}
}
Route.js主要是区分业务的怎删改查根据领域模型划分多个业务体系
const { request } = require('./request.js')
//restful类型接口
module.exports = {
GetUsers:(data) => request('/api/identity/users/{id}',{},'GET'),
PostUsers:(data) => request('/api/identity/users/{id}',data,'POST'),
PutUsers:(data) => request('/api/identity/users/{id}',data,'PUT'),
DeleteUsers:(data) => request('/api/identity/users/{id}',{},'DELETE'),
}
import { GetUsers,PostUsers,PutUsers,DeleteUsers} from "../../utils/route"
GetUsers(id,{}).then((res)=>{
this.setData({
list: res.data
})
})
PostUsers(id,data).then((res)=>{
wx.showToast({
icon:'none',
title: res.Msg,
})
})
PutUsers(id,data).then((res)=>{
wx.showToast({
icon:'none',
title: res.Msg,
})
})
DeleteUsers(id,{}).then((res)=>{
wx.showToast({
icon:'none',
title: res.Msg,
})
})
读到这里,这篇“Request网络请求如何封装”文章已经介绍完毕,想要掌握这篇文章的知识点还需要大家自己动手实践使用过才能领会,如果想了解更多相关内容的文章,欢迎关注亿速云行业资讯频道。
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。
网络异常,请检查网络