项目有个需求,有一个接口请求的时候时间比较长,点击取消按钮的时候把接口取消了,防止接口返回后有后续的操作。
- 在项目中引入axios
import axios from 'axios'
- 接口中引用
// post请求
const CancelToken = axios.CancelToken;
const source = CancelToken.source();
this.$axios.post('/api/XXX/XXX/XXX/info', {
type: 1, // 0导入回放 1正常回放
lineName: this.sectionName,
folder: this.formlist.time,
startTime: this.formlist.startTime,
stopTime: this.formlist.endTime,
}, {
cancelToken: source.token
}).then(res => {
// 成功后的逻辑
})
// get请求
this.$axios.get('XXX/xxx/xxx',{参数: ""},{cancelToken: source.token}).then(res =>{
// 成功后的逻辑
})
- 取消请求
source.cancel("取消请求")
- axios取消后会进入catch中,判断是否是取消
axios.isCancel(error) //为true时表示接口取消
参考链接
https://blog.csdn.net/wswq2505655377/article/details/129202680