So verhindern Sie mehrere Ajax-Requets ohne die Einführung von Nebenwirkungen

Question

Hier ist die allgemeine Lösung, um mehrere Anfragen während Ajax-Aktion zu verhindern.

Aber wie kann ich diese Arbeit beenden, ohne irgendwelche Zustände in meiner App zu ändern, genau wie funktionale Programme tun.

Answer 1

Sie können es nicht ohne Zustand zu halten, aber man kann es schönere machen, indem Sie den Zustand in einer generischen Komponente eingekapselt wird. Zum Beispiel:

(function($){ 
    $.fn.extend({ 
     smartOn: (type, funcHandler) => { 
      return this.each(function() { 
       let $me = $(this); 
       let isRequesting = false; 
       $me.on(type,() => { 
        if (isRequesting) { 
         console.log('ajax still in progress, please wait'); 
         return false; 
        } 

        isRequesting = true 

        funcHandler(() => { 
         isRequesting = false; 
        }); 
       }); 
      }); 
     } 
    }); 
})(jQuery); 

Und dann es so nennen:

$('#fetch').smartOn("click", (callbackDone) => { 
    $.get(SOME_RESOURCE, (data) => { 
     console.log('success with :', data) 
     callbackDone(); 
    }) 
}); 

Denken Sie daran callbackDone() in jedem Szenario zu nennen (das heißt auch, wenn $.get ausfällt). Wenn Sie Promises anstelle von Callbacks verwenden, kann es auch ein wenig netter aussehen (insbesondere die Notwendigkeit, jedes Szenario mit $.get zu behandeln).