romise.all( ).then( )

处理多个异步任务，且所有的异步任务都得到结果时的情况。
比如：用户点击按钮，会弹出一个弹出对话框，对话框中有两部分数据呈现，这两部分数据分别是不同的后端接口获取的数据。

弹框弹出后的初始情况下，就让这个弹出框处于数据加载中的状态，当这两部分数据都从接口获取到的时候，才让这个数据加载中状态消失。让用户看到这两部分的数据。
那么此时，我们就需求这两个异步接口请求任务都完成的时候做处理

template><div class="box"><el-button type="primary" plain @click="clickFn">点开弹出框</el-button></div>
</template><script>
export default {name: "App",methods: {clickFn() {this.alertMask = true; // 打开弹出框this.loading = true; // 暂时还没数据，所以就呈现loading加载中效果// 第一个异步任务function asyncOne() {let async1 = new Promise(async (resolve, reject) => {setTimeout(() => {// 这里我们用定时器模拟后端发请求的返回的结果，毕竟都是异步的let apiData1 = "第一个接口返回数据啦";resolve(apiData1);}, 800);});return async1;}console.log("异步任务一", asyncOne());  // 返回的是一个Promise对象// 第二个异步任务function asyncTwo() {let async2 = new Promise(async (resolve, reject) => {setTimeout(() => {let apiData2 = "第二个接口返回数据啦";resolve(apiData2);}, 700);});return async2;}console.log("异步任务二", asyncTwo()); // 返回的是一个Promise对象let paramsArr = [asyncOne(), asyncTwo()]// Promise.all方法接收的参数是一个数组，数组中的每一项是一个个的Promise对象// 我们在 .then方法里面可以取到 .all的结果。这个结果是一个数组，数组中的每一项// 对应的就是 .all数组中的每一项的请求结果返回的值Promise.all(paramsArr).then((value) => {console.log("Promise.all方法的结果", value);this.loading = true; // 现在有数据了，所以就关闭loading加载中效果});},},
};
</script>