uni.request({
method: "POST",
url: "http://huiyi.qinfenniao.com/api/Login/updateInfo",
data,
header:{token:uni.getStorageSync('token')},
success(res) {
console.log(res)
}
});
上边的代码是一个最简单的请求 没有经过任何的封装 直接写在了页面中 需要手动的去配置请求方式、请求路径、请求参数、请求头、成功的回调函数; 这样直接的在代码中去写并不易于管理 还会写很多重复的代码
在有大量的请求调用时比较好的处理方式是封装到一个js文件中;
在该js文件中写入网络请求的代码 这里的网络请求代码中的数据都不应该写死 应该是根据传递的值来进行相应的网络请求 这个js文件将会作为一个公共的函数来传递出去
const location = "http://shuzizhaopin.qinfenniao.com"
export default {
Request(token,data,api,res){
uni.request({
header:{token:Token},
url:location + api,
data:data,
method:"POST",
success:(data)=>{
res(data);
}
})
}
上边就是在js文件中写入的代码
第一行声明了一个公共的请求地址 在传递请求地址的时候只传递地址最后面不同的部分就可以了
第二行 export default 表示如果在别的vue文件中通过import 来引入该文件时将会返回 export default代码后的对象
从第三行开始就是公共网络请求的主体 网络请求的代码包含在Request这个函数中 在使用的时候应该是调用Request这个函数 然后通过不同的传参来进行不同的请求调用
引入js代码
在uni文件的main.js这个文件中 通过import 来引入公共网络请求的js文件 然后将引入的文件 通过Vue.prototype.$api = api 添加到vue的原型当中 这样在每一个界面中都可以访问到这个公共方法
在页面中使用
this.$api.Request(uni.getStorageSync("token"),{post_id:this.wordId,qiye_id:this.qiyeId},"/api/user/invite",res=>{
console.log(res)
})
调用公共方法后第一个传递的值应该是token 是添加在请求头上 如果不需要传token 直接写一个空字符串即可
第二个传递的值是data里面的值 请求所携带的参数
第三个是请求的路径部分 在文件中定义了公共路径 只需要传最后不同的部分
最后一个值是回调函数 执行完 Request()函数中的请求后将会回调该函数 并将请求返回值作为参数传递进来;
公共请求中唯一写死的地方是请求的方法是POST请求 也可以多加一个值来设置请求方法 或者再写一份专门用来GET请求的公共函数
0条评论