vue axios 取消上次請求

axios.defaults.timeout = 1000 * 5
axios.defaults.baseURL = baseUrl
var CancelToken = axios.CancelToken;
let cancel;
export const api_prefix =  '/face_recognition_app/v1.0';
var error_info={
    code:402,
    msg:"網絡請求發生錯誤！"
};

//獲取人員列表
export const personList = function () {
    var args = util.argumentsFmt(arguments);//轉換參數
    var cancel=null;
    Vue.axios.post( api_prefix + '/personquery',args.param,{ cancelToken: new CancelToken(function executor (c) {
            cancel = c
        })
    } )
        .then((res) => {
            args.callBack(res.data);
        })
        .catch((e) => {
            if (axios.isCancel(e)) {
                console.log('Request canceled', e.message);
            } else {
                error_info.msg=e.message;
                args.callBack(error_info);
            }

        })
        .finally(() => {
            args.final()
        })
    return cancel;
}

.vue文件中
data里添加

cancelList:[]
momethods{

cancelReq:function(){
    for(let i=0;i<this.cancelList.length;i++){
        if (typeof this.cancelList[i] === 'function') {
            this.cancelList[i]();
        }
    }
},

getList:function (val) {
    var _this=this;
    if(!val||val==1){
        _this.currentPage=1;
    }

    var param={
        pageNum:val?val:1,
        size:_this.pageSize
    };
    _this.cancelList.push(getPerson

personList(param,function (data) {

        if(data.code==0){
            _this.dataInfo=data.data;
            _this.total=data.total;
            _this.msg="暫無數據！"
        }else{
            _this.msg=data.msg?data.msg:'查詢失敗！';
        }

        _this.loading=false;
    }));
}

},

watch: {
    '$route' (to) { //監聽路由是否變化
        this.cancelReq();
        this.cancelList=[];
        this.urlType=to.name=='alarm'?'3':to.name=='discern'?'2':'1'
        this.selectReset();
        this.getList();
    },
},