Javascript 循环进度React.js的计数

我这里有一个函数，它循环遍历一组图像文件，读取文件，然后一次一个文件上传到aws s3

我试图弄清楚如何跟踪循环何时完成，然后将useState变量设置为true，以便有条件地呈现某些元素

我正在考虑创建一个计数器，当计数器等于数组长度时，调用useState，但我不确定最好的方法是什么

对此，我们非常感谢您的指导

  async function handleSubmit(event) {
         event.preventDefault();

      const filesAsArray = [...fileToUpload.current.files];

        for (let i = 0; i < filesAsArray.length; i++) {                       

      const content = await readContent(filesAsArray[i]);
                      await uploadFile(content);

        }

    }

异步函数handleSubmit（事件）{ event.preventDefault（）； const filesaarray=[…fileToUpload.current.files]； 对于（设i=0；i

for（设i=0；i

您可以为循环创建一个承诺，当循环完成时，您可以用这种方式解析承诺，只有当它实际完成时，您才会设置为完成

const loop = new Promise((resolve, reject) => {
  for (let i = 0; i < 1000; i++) {                       // DO it
      console.log(i)
  };
  resolve('Done');
});

loop.then((successMessage) => {
  console.log("Yay! " + successMessage) 
});

const循环=新承诺（（解析、拒绝）=>{
对于（设i=0；i<1000；i++）{//执行此操作
控制台日志（i）
};
决议（“完成”）；
});
循环。然后（（成功消息）=>{
console.log（“耶！”+成功消息）
});

---

这里有一个小例子

这确实有效，这也是我最初打算做的，但我不确定这是否是最有效的方法。目前看来效果不错。非常感谢。

if

语句将仅在

解析两个等待后运行

。在上一次迭代中，

i==arr.length-1

。在等待之后编写

if

，意味着所有迭代都过于完美，这是有意义的。谢谢你的解释！你能在for循环之后设置state（completed）吗？我就是这么想的too@forresthopkinsa我认为他想确保所有的承诺都得到解决，而没有任何人失败。如果他等待一个拒绝的承诺，它将抛出一个错误并立即退出函数。

const loop = new Promise((resolve, reject) => {
  for (let i = 0; i < 1000; i++) {                       // DO it
      console.log(i)
  };
  resolve('Done');
});

loop.then((successMessage) => {
  console.log("Yay! " + successMessage) 
});