首先创建一个common文件,文件中写一个request.js
话不多说直接上代码
export default {
// 全局配置
common:{
baseUrl: "http://ceshi.dishait.cn",
header:{
"Content-type" : "application/json;charset=UTF-8"
},
data:{},
method:"GET",
dataType:'json'
},
// 请求返回 promise
request(options={}){
let common = this.common;
// 组织参数
options.url = common.baseUrl + options.url;
options.header = options.header || common.header;
options.data = options.data || common.data;
options.method = options.method || common.method;
options.dataType = options.dataType || common.dataType;
// 请求
return new Promise((res,rej)=>{
uni.request({
...options,
success(result){
let {statusCode,data} = result;
// 返回原始数据
if(options.native){
return res(result)
}
// 服务端失败
if(statusCode !== 200 ){
if(options.toast !== false){
uni.showToast({
title:data.msg || "服务端失败",
icon:"none"
})
}
return rej(data)
}
res(data)
},
fail({errMsg}) {
uni.showToast({
title:errMsg || "请求失败",
icon:"none"
})
return rej()
}
})
})
},
// get请求
get(url,data={},options={}){
options.url = url;
options.data = data;
options.method = 'GET';
return this.request(options)
},
// post请求
post(url,data={},options={}){
options.url = url;
options.data = data;
options.method = 'POST';
return this.request(options)
},
// delete请求
delete(url,data={},options={}){
options.url = url;
options.data = data;
options.method = 'DELETE';
return this.request(options)
}
}
然后在main.js引入
import Vue from 'vue'
import App from './App'
//引入request
import request from '@/common/request.js'
Vue.config.productionTip = false
App.mpType = 'app'
//挂载到vue的原型上
Vue.prototype.$http = request
const app = new Vue({
...App
})
app.$mount()
组件中使用
mounted() {
this.$http.get("/app_index").then(res => {
this.swiperImages = res.swiperImages
})
}