根目录下新建 util文件夹：
uniapp封装里面两个js文件：request.js 和 api.js
1662a26a6a9112接下来 开始cv：
打开request.js 拷贝：
代码语言：javascript复制// 请求接口 换成你自己的 （仅为示例 非真实接口）
const commoneUrl = "http://test.cn/api/";
//get请求封装
function getRequest(url, data) {
var promise = new Promise((resolve, reject) => {
var postData = data;
uni.request({
url: commoneUrl url,
data: postData,
method: "GET",
dataType: 'json',
header: {
'content-type': 'application/json',
token: uni.getStorageSync('token') || ''
},
success: function(res) {
if (res.statusCode === 200) {
resolve(res.data);
} else {
resolve(res.data)
}
},
error: function(e) {
reject('网络出错');
}
});
});
return promise;
}
//post请求封装
function postRequest(url, data) {
var promise = new Promise((resolve, reject) => {
var postData = data;
uni.request({
url: commoneUrl url,
data: postData,
method: 'POST',
header: {
'content-type': 'application/json',
token: uni.getStorageSync('token') || ''
},
success: function(res) {
if (res.code === 200 && res.code == 0) {
resolve(res.data);
} else {
resolve(res.data)
}
},
error: function(e) {
reject('网络出错');
}
})
});
return promise;
}
module.exports = {
postRequest,
getRequest
}然后打开 api.js 拷贝：
代码语言：javascript复制// 导入上面封装的请求
const request = require('../util/reuqest.js')
// 获取用户信息的请求方法 get类型
var getUser = function(){
return request.getRequest('user'); //user---接口名称
}
// 获取列表的请求方法 post类型
var getList = function(){
return request.postRequest('list'); //list---接口名称
}
// 导出所有的请求方法（与上面的函数名称对应） 以便在其他组件使用此请求方法
module.exports = {
getUser,
getList
}使用请求方法：
代码语言：javascript复制 // 导入需要的方法 例如这里需要 获取用户信息
// 所以导入的是 getUser方法 导入名称与api里面导出的一致
import {getUser} from '@/util/api.js'
export default {
data() {
return {
userInfo:''
}
},
onShow(){
this.userInfo()
},
methods: {
// 调用获取用户信息
userInfo(){
getUser().then(res=>{
console.log('用户信息',res);
this.userInfo = res.data
})
}
}
}本文共 206 个字数,平均阅读时长 ≈ 1分钟
