vue Promise 对象 等待所有异步处理完成 再继续处理

1 定义数据集合 用来搜集所有数据

  let promises = [];  // 用来存储所有的 Promise 对象

2 promise对象 异步 返回数据 同时添加数据到promises 列表

// 依次读取列表元素的表
for (let symbol of symbolList) {

 let promise = new Promise((resolve, reject) => {  // 将请求数据和处理数据的代码封装成 Promise 对象

    // 异步事务 
      getRequest.onerror = function (event) {
        console.log('读取数据出错');
        reject(event.target.error);
      };

      getRequest.onsuccess = function (event) {
        let data = event.target.result;

        if (data != undefined) {
          that.logList.push(`数据获取成功 : ${key}`)
          let kdataAndmaObj = funcKdataAndMaObj(params.cycle, data)

          let analysisedData = funcMa(kdataAndmaObj, params.cycle, tableName)
          
         //
         // 异步结果返回给promise 对象

          resolve(analysisedData);  // 将处理后的数据传递给 resolve() 函数
        } else {
          console.log(`${key} 数据不存在`);
          that.logList.push(`数据不存在 : ${key}`)
          resolve(null);  // 表示数据不存在
        }
      };
    });
    promises.push(promise);  // 将 Promise 对象加入 promises 列表中
  }

3 Promise.all() 方法等待所有的 Promise 对象都执行完成后,才会执行 .then() 中的回调函数

Promise.all(promises).then(results => {
    // 在所有 Promise 对象都完成后执行下一步操作
    let DataAll = results.filter(result => result !== null);  // 过滤掉不存在的数据
    console.log('DataAll :', DataAll );

    // 处理剩余的代码...
  }).catch(error => {
    console.log('发生错误:', error);
  });

4 总结

promise对象 异步处理

Promise.all() 等待所有异步完成 在里面处理所有数据

你可能感兴趣的:(vue,vue,异步,vue.js,javascript,前端)