Promise.all() 的使用

使用场景描述

• 在我们的项目中，对用户信息进行编辑时，需要回显用户的区域权限，如果当前用户是全权限的，则需要使全选按钮是选中状态。
• 非全权限的用户，只默认选中有权限的城市。
  
• 全权限的用户，除了默认选中有权限的城市外，还需要额外点亮全选按钮。
  
• 起初我的思路是，对比后台返回的当前用户的城市权限数组 cityList 和 全区域数组 dataTree，两个数组的长度一致时，可以认为当前用户具有全权限，即可点亮全选按钮。
• 遇到的问题是，后台提供的查区域的接口，是根据父 code 去查询下级的区域。即，如果想要获取全区域数组 dataTree 需要先获取到所有的省，再通过遍历省的数据，去请求当前省下的所有市。
  
• 因此，我需要等待，dataTree 完全加载完后，再去对比 cityList 和 dataTree。

Promise.all() 的使用方法

Promise.all() 的使用

• 使用

const promise1 = Promise.resolve(3);
const promise2 = 42;
const promise3 = new Promise((resolve, reject) => {
  setTimeout(resolve, 100, 'foo');
});

Promise.all([promise1, promise2, promise3]).then((values) => {
  console.log(values);
});
// expected output: Array [3, 42, "foo"]

• 入参

 Promise.all(iterable);
  // iterable 一个可迭代对象，Array 或 String

• 返回值
  • 如果传入的参数是一个空的可迭代对象，则返回一个已完成（already resolved）状态的 Promise。
  • 如果传入的参数不包含任何 promise，则返回一个异步完成（asynchronously resolved）Promise。
  • 其它情况下返回一个处理中（pending）的Promise。这个返回的 promise 之后会在所有的 promise 都完成或有一个 promise 失败时异步地变为完成或失败。
• 兼容性
  

Promsie.all() 在本案例中的使用

• 定义空数组，用来存放 Promise 实例
• 在获取到省级数据之后，遍历省级数据时，执行 push 操作，将获取市级的方法推到数组中
• 遍历后，执行 Promise.all 的方法