Promise.all页面数据显示

对于页面数据显示，Promise.all 可以用来同时处理多个异步操作，并等待所有操作完成后再进行下一步处理。以下是一个示例代码：

const fetchData = (url) => {
  return new Promise((resolve, reject) => {
    // 进行异步数据请求
    // 例如使用 fetch 或 axios
    // 这里假设返回的是一个 Promise 对象
    fetch(url)
      .then((response) => response.json())
      .then((data) => resolve(data))
      .catch((error) => reject(error));
  });
};

const urls = [
  'https://api.example.com/data1',
  'https://api.example.com/data2',
  'https://api.example.com/data3'
];

Promise.all(urls.map(fetchData))
  .then((results) => {
    // 所有数据请求完成后的处理
    // results 数组包含了每个异步操作的结果
    console.log(results);
    // 在这里可以更新页面数据显示
  })
  .catch((error) => {
    // 错误处理
    console.error(error);
  });

在上面的示例中，我们定义了一个 fetchData 函数来进行数据请求，然后使用 Promise.all 来处理多个异步操作。urls 数组包含了需要请求的 URL 地址，我们使用 map 方法来遍历数组并对每个 URL 调用 fetchData 函数。最后，使用 then 方法来处理所有异步操作完成后的结果，并进行相应的页面数据显示。如果任何一个异步操作出现错误，将会进入 catch 块进行错误处理。