foreach,等待每次迭代直到接收到响应(使JS同步)

定义 saveToDatabase(id) 作为异步函数,在本例中使用 await .

参考文献: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/async_function

编辑: 此外,还应向 saveToDabase 功能。

savetodatabase函数的实现:

$('#myBtn').click(function() {
   let elements = $('.checkboxes:checked');

   for (let element of elements) {
       await saveToDatabase(id);
   }
}) 

async function saveToDatabase(id) {
   return axios.get('/save-to-db/' + id)
       .then(response => {
           return true;
       }).catch(err => {
           return false;
   });
}

我也忘了: 在其中使用wait的函数,也需要前面有async。

自从 forEach 使用回调函数,很难一直使用它来同步调用。相反,我认为使用 for 循环将工作。

$('#myBtn').click(async () => {
    let elements = $('.checkboxes:checked');
    for (let element of elements) {
        let id = $(element).data('id');
        await saveToDatabase(id);
    }
});

有很多方法可以让请求彼此等待。对您来说,最简单的方法是保存最新请求的引用,承诺在上次解决时调用下一个请求(内部 then 功能)。

$('#myBtn').click(function() {
   let elements = $('.checkboxes:checked');
   let previousCall = Promise.resolve();

   elements.forEach(function(i, el) {
      let id = $(el).data('id');

      previousCall = previousCall.then(() => saveToDatabase(id));
      // I want it to pause here until it receives a response from other function
      // before going to the next iteration..
   })

})   


function saveToDatabase(id) {
   return axios.get('/save-to-db/' + id)
       .then(response => {
           return true;
       }).catch(err => {
           return false;
   });
}