AXIOS超时取消请求

背景

今天发现项目在网络不好的时候发出请求会一直使页面处于等待状态，十分不友好。所以我在发出请求的函数中增加了取消axios请求的方法。
设置如下

	  //axios外
      const CancelToken = axios.CancelToken;
      let cancel;
      
      //axios内
      /**设置CancelToken 提前结束AXIOS请求 通过cancel()调用*/
        cancelToken: new CancelToken(function executor(c) {
          cancel = c;
        }),
     
     //通过cancel();触发

通过这些就可以用来实现超时取消axios，只需要在发出请求前调用setTimeout触发cancel()并取消等待状态图即可。

      let timer =
      setTimeout(() => {
        cancel();
        this.$Notice.error({
          title: `XXXXXXXX`,
          desc: "请求超时!"
        });
        this.show_why_err();
        this.$Spin.hide();
        is_cancel = true;
      }, 5000);

---

但是

这样的请求会触发catch方法中的函数，判断catch的err参数即可，为"Cancel"则不触发catch中的方法即可

---

问题解决

不过这种写法会有一个问题，如果是增删改操作，可能服务器已经做出的操作，而还没有返回响应，此时同样会触发超时。暂时是以警报的形式提醒别人注意。有更好的方法以后会更新。