web-dev-qa-db-ja.com

axiosに保留中のリクエストがあるかどうかを知る

私はReactJSの初心者で、ajax呼び出しで Axios ライブラリを使用しようとしました。それは素晴らしいですが、今私はaxiosインターセプターに保留中のリクエストがあるかどうかを知る方法があるかどうか知りたいです約束は解決されました。とりあえず、インターセプターから始めました:

axios.interceptors.request.use(function (config) {
    //here logi of show loading
    return config;
}, function (error) {
    return Promise.reject(error);
});

そして、私はこのようなものを追加したいと思います:

axios.interceptors.respose.use(function (config) {
    //logic remove loading if it is last response
    return config;
}, function (error) {
    return Promise.reject(error);
});

それで、(可能であれば)最後の応答かどうかをどうやって知るのでしょうか? ReactJsを使用する前に、Angular 1.xと$http service ありました

$http.pendingRequests

$ httpサービスのようなものがaxiosにありますか?

11
LorenzoBerti

これは私の解決策でした:)

var numberOfAjaxCAllPending = 0;

// Add a request interceptor
axios.interceptors.request.use(function (config) {
    numberOfAjaxCAllPending++;
    // show loader
    return config;
}, function (error) {
    return Promise.reject(error);
});

// Add a response interceptor
axios.interceptors.response.use(function (response) {
    numberOfAjaxCAllPending--;
    console.log("------------  Ajax pending", numberOfAjaxCAllPending);

    if (numberOfAjaxCAllPending == 0) {
        //hide loader
    }
    return response;
}, function (error) {
    return Promise.reject(error);
});
13