vue取消axios请求进程

定义全局参数

var CancelToken = axios.CancelToken;
var source = CancelToken.source();

data里面定义参数source

data(){
    return{
      source: null, //存放取消的请求方法
    }
}

axios请求

  checkWechatQrcodeStatus(value) {
    this.cancelQuest(); //在请求发出前取消上一次未完成的请求;
    let that = this;
    axios({
        headers: {
          'Content-Type': 'application/json'
        },
        cancelToken: new axios.CancelToken(function executor(c) {
          that.source = c;
        }),
        method: 'get',
        url: routerurl,
        data: {
          
        }
      }).then(res => {
        // console.log(res)
      })
      .catch(error => {
        if (axios.isCancel(error)) {
          console.log('Rquest canceled', error.message); //请求如果被取消,这里是返回取消的message
        } else {
          //handle error
          console.log(error);
        }
      })
  },

终止请求

cancelQuest() {
    if (typeof this.source === 'function') {
      this.source('终止请求'); //取消请求
    }
  },

你可能感兴趣的:(vue取消axios请求进程)