vue项目取消axios请求

119 阅读1分钟

axios取消请求

vue项目中取消已经发起的数据请求。

#api.js
export const putFile = (data,source) => {
  return request({
    url: 'url',
    method: 'post',
    headers: { 'Content-Type': 'multipart/form-data' },
    cancelToken: source.token,
    data
  })
}

#page.vue
import { putFile } from "@/api.js";
data(){
    return{
        source:null
    }
},
    //发起请求
 async requestFile() {
     this.source=axios.CancelToken.source();
     let data={}//参数
     try{
         const res=await putFile(data,this.source);
	}catch(error){
        console.log(error.message)
	}
 },
     //取消请求
 cancelRequest(){
      if (this.source) {
        this.source.cancel("Request canceled by user");
  	  }
 }