uniapp中uni.request用的比较多,用起来起来过于麻烦通常封装后使用提高效率
首先创建一个js文件
上代码:
const BASE_URL = 'https://huoguo.qinfenniao.com' //域名或选取所有接口不变的那一部分
export const myRequest = (options) => { //暴露一个function:myRequest,使用options接收页面传过来的参数
return new Promise((resolve, reject) => { //异步封装接口,使用Promise处理异步请求
uni.request({ //发送请求
url: BASE_URL + options.url, //接收请求的API
method: options.method || 'POST', //接收请求的方式,如果不传默认为POST
data:options.data || {}, //接收请求的data,不传默认为空
success: (res) => { //数据获取成功
if (res.data.code !== 1) { //因为200是返回成功的状态码,如果不等于200,则代表获取失败,
return uni.showToast({
title: "数据获取失败!"
})
}
// console.log(res.data.datas);
resolve(res.data) //成功,将数据返回
},
fail: (err) => { //失败操作
uni.showToast({
title: "请求接口失败!"
})
reject(err)
}
})
})
}
封装好以后在mian.js全局挂载
import app from './app'
import { myRequest } from './api/encapReq.js'
// #ifndef VUE3
import Vue from 'vue'
Vue.prototype.$API = myRequest //挂载到Vue的原型上
Vue.config.productionTip = false
app.mpType = 'app'
const app = new Vue({
...app
})
app.$mount()
// #endif
最后就可以载你写的页面使用了
async swiperFu() {
let res = await this.$API({
url: '/api/coupon/carous',
});
this.swiperImg = res.datas;
},
原创©本文章为王孟旺原创,未经许可,禁止转载
0条评论