एजेक्स स्टार्ट और AJAXStop fetch API

Question

के बराबर समतुल्य मैं Fetie API का उपयोग करने के लिए jQuery AJAX का उपयोग करने से अपने एपीआई कॉल माइग्रेट करने का प्रयास कर रहा हूं।

मैं सर्वर कॉल के दौरान लोडिंग स्पिनर प्रदर्शित करने के लिए jQuery AJAXStart और AJAXStop का उपयोग कर रहा था।

मैं कई समांतर सर्वर अनुरोध चला रहा हूं, मैं चाहता हूं कि पहला अनुरोध शुरू होने पर स्पिनर शुरू हो जाए और आखिरी अनुरोध कब बंद हो जाए।

यह jQuery के साथ बहुत सीधे फव्वारा था। हालांकि, मुझे fetch API का उपयोग करके एक समान तकनीक नहीं मिल रही है। कोई विचार?

Answer 1

आप को सूचित करने के Promise उपयोग कर सकते हैं जब fetch कहा जाता है और Fetch: POST json data

पूरा

var params = { 
    a: 1, 
    b: 2 
}; 

var data = new FormData(); 
data.append("json", JSON.stringify(params)); 

var currentRequest = new Request("/echo/json/", { 
    method: "POST", 
    body: data 
}); 

var start, complete; 
var fetchStart = new Promise(function(_start) { 
    start = _start; 
}) 

var fetchComplete = new Promise(function(_complete) { 
    complete = _complete; 
}); 
// do stuff when `fetch` is called 
fetchStart.then(function(startData) { 
    console.log(startData) 
}); 
// do stuff when `fetch` completes 
fetchComplete.then(function(completeData) { 
    console.log(completeData) 
}); 

var request = fetch(currentRequest); 

[request, start({ 
    "fetchStarted": currentRequest 
})].shift() 
.then(function(res) { 
    if (res.ok) { 
    // resolve `fetchComplete` `Promise` when `fetch` completes 
    complete({ 
     "fetchCompleted": res 
    }) 
    }; 
    return res.json(); 
}) 
.then(function(data) { 
    document.body.textContent = JSON.stringify(data) 
}) 
.catch(function(err) { 
    // if error, pass error to `fetchComplete` 
    complete({ 
    "fetchCompleted": res, 
    "error": err 
    }); 
}); 

jsfiddle https://jsfiddle.net/abbpbah4/18/

---

भी देखें है