ajax
ajax 为全局提供的异步请求方法,拦截方法在
@/extends/request/interceptor.js
中,可以在 js 中 引入@/extends/ajax.js
调用,也可以在.vue
文件中直接this.$ajax
来调用。
全局基础配置
http.setConfig({
baseUrl: 'http://localhost:8036',
// 如果将此值设置为true,拦截回调中将会返回服务端返回的所有数据response,而不是response.data
// dataType: 'json',
loadingText: '请求中...', // 请求loading中的文字提示
// loadingTime: 800, // 在此时间内,请求还没回来的话,就显示加载中动画,单位ms
originalData: true, // 是否在拦截器中返回服务端的原始数据
// showLoading: true, // 是否显示请求中的loading
// loadingMask: true, // 展示loading的时候,是否给一个透明的蒙层,防止触摸穿透
// 设置自定义头部content-type
header : {
// Accept: "application/json; charset=utf-8",
// 'Content-Type' : 'application/json' //json
'Content-Type' : 'application/x-www-form-urlencoded' //formData
}
});
更多配置 请直接 @/extends/request/interceptor.js
中设置。
请求方法
ajax (calllback Pormise)
ajax({
url : '',//请求地址
type : 'post',//采用post方式提交
data : {},//请求数据
tip: false,//提交是否需要确认,true或string需要确认
calltip : false,//提交成功后显示请求成功信息
jsonData : false,//是否json格式,默认false 为formData
showLoading : true,//是否显示loading
success(){},//code = 200 或者 201返回事件
callback(){}//请求成功返回事件
});
ajax.post / ajax.get / ajax.postJson
ajax 的快捷写法 Function(url,data,tip=false,jsonData=false,calltip=false)
,例如:
ajax.post('/api/test', {a: 1}, '你确定提交此请求吗?').then(res => {
console.log(res)
});
vue文件中使用
this.$ajax({
url : this.url,
tip:'你确定提交此请求吗?',
success : function(rst){
console.log('success',rst)
},
callback: (rst)=>{
console.log('callback',rst)
}
}).then(res=>{
console.log(res)
});
this.$ajax.post(...).then(res=>{
...
})