原生的axios书写是这样的:
axios({
url: 接口地址,
method:请求方法,
data:携带数据,
}).then(res=>{
//请求接口成功的逻辑
}).catch(err=>{
//请求接口失败的逻辑
})
Promise封装后:
export const get=(url,params){
params=params||{};
return Promise((resolve,reject)=>{
axios.get(url,{params})
.then(res=>{resolve(res);})
.catch(error=>{reject(error);});
})
}
将get方法挂在在Vue上。
Vue.prototype.$http={get,post};
调用
async geyList(){
var res=await this.$http(url,params);
}
promise有三种状态,分别为进行中(pending
),成功(resolved--
也叫fulfilled)失败态rejected
promise的方法
promise.then(()=>{}) ,//成功的回调,异步微任务
promise.catch(()=>{}) //失败的回调,异步微任务
promise.all([]); //接收一个可迭代的promise对象,如数组,执行所有的promise请求,有一个不成功,则返回不成功的回调
promise.any([]); //接收一个可迭代的promise对象,如数组,执行所有的promise请求,有一个成功,则返回成功的回调,全部子失败才算失败。
promise.race([]); //接收一个可迭代的promise对象,如数组,执行所有的promise请求,执行最先请求的回调。
promise.allSettled([]); //接收一个可迭代的promise对象,如数组,执行所有的promise请求,不管成功与否都返回。