Javascript 如何在循环中的所有异步调用完成后调用函数？

reader.onloadend调用异步函数addData，reader.onloadend处于循环中

const uploadFiles = () => {
    console.log(acceptedFiles)
    setLoading(true)
    console.log(loading)
    let i = 0
    let l = acceptedFiles.length

    for (i = 0; i < l; i++) {
      let file = acceptedFiles[i]
      const reader = new window.FileReader()
      reader.readAsArrayBuffer(file)
      reader.onloadend = () => {
        let buffer = Buffer(reader.result)
        console.log(buffer)
        addData(file.path, buffer)
      }
    }
  }

我想在循环中的所有async addData都被调用之后调用setLoading（false）。 onClick函数不工作，在所有异步函数完成之前单击按钮时，加载设置为false

const [loading, setLoading] = useState(false)
<button onClick={() => {
                uploadFiles()
                 setLoading(false) 
             }}
            disabled={loading}
          >

const[loading，setLoading]=useState（false）
{
上传文件（）
设置加载（错误）
}}
已禁用={loading}
>

使用承诺，您可以知道何时读取了所有文件。基本思路如下

const uploadFiles=（evt）=>{
//将加载设置为true；
const acceptedFiles=[…evt.target.files]；
//创建承诺映射，在读取文件时解析承诺映射
const readerPromises=acceptedFiles.map（文件=>{
返回新承诺（解决=>{
const reader=new window.FileReader（）
reader.readAsArrayBuffer（文件）
reader.onloadend=（）=>{
console.log（文件）；
let buffer=reader；//buffer（reader.result）
解析（[文件名，缓冲区]）
}      
});
});
//检测所有承诺何时完全加载
Promise.all（readerPromises）。然后（results=>{
控制台日志（结果）；
//将加载设置为false；
});
};
承诺。。。。。。为什么不在上传文件中的for循环之后写入
setLoading（false）
，这将在读取所有文件之前将其设置为false。
const [loading, setLoading] = useState(false)
<button onClick={() => {
                uploadFiles()
                 setLoading(false) 
             }}
            disabled={loading}
          >