在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ axios 如何用攔截器,只保留某個接口最新的一次請求

axios 如何用攔截器,只保留某個接口最新的一次請求

有這個一個使用場景,一個篩選頁面,用戶可以快速點擊篩選條件,篩選條件一變,馬上請求數(shù)據(jù)api,但是接口遠在國外,可以理解為請求非常耗時,所以這個接口,經(jīng)常會同時會有好幾個請求在處理,然后頁面數(shù)據(jù)會閃。

所以我想,對于同一個url,所有請求只留最新,舊的請求無論是成功還是padding狀態(tài),都放棄,網(wǎng)上查好多文章都只是說取消重復請求問題,跟我想要的有點區(qū)別,加上對前端不熟悉(本菜是后臺,首次寫前端項目),想好久未能想明白,故此勞煩各位大佬,為小弟指點一二,不勝感激!

現(xiàn)在已有攔截器如下(已刪除無關(guān)代碼)

import axios from 'axios'
const service = axios.create({
    baseURL: 'a.com',
})
service.interceptors.request.use(config => {
    return config
}, error => {
    console.log(error)
    Promise.reject(error)
})
service.interceptors.response.use(
    response => response,
    error => {
        console.log('err' + error)
        return Promise.reject(error)
    })

export default service
回答
編輯回答
骨殘心

你還需要axios的中斷請求, cancelToken。

進入頁面后先執(zhí)行:

this.source = this.$axios.CancelToken.source();

每個axios請求都記得帶上參數(shù):

cancelToken: this.source.token

離開頁面或者按你目前的需求,每次發(fā)請求都中斷舊的請求:

this.source.cancel('Operation canceled by the user.');

參考:請搜索Cancellation

2017年7月25日 02:13