vue js 多组件异步请求解决方案

接口之间异步问题可以采用Promise+async+await
链接： https://blog.csdn.net/qq_39816586/article/details/103517416

---

使用场景：
1.保障用户必须完成自动登录，才调用后续逻辑
2.保障必须完成初始启动，才调用后续逻辑
3.保障先执行onLoad，才调用后续逻辑
…

举例：
父组件有一个接口A，子组件有一个接口B
两个的接口调用顺序，不是固定的，有时B先执行，有时A先执行
最终目的：A先执行在执行B

---

父组件A

import Vue from 'vue'setup(props, context) {const getA = async () => {// 赋值全局变量Vue.prototype.$checkA = new Promise(resolve => {Vue.prototype.$hasA = resolve})await request('A')// 接口A执行完毕，调用回调context.root.$hasA() // vue3写法 this.$hasA() // vue2写法}return {getA}
}

子组件B

setup(props, context) {const getB = async () => {// 等待接口A先执行完毕，在执行接口Bawait content.root.$checkA // vue3写法  await this.$checkA // vue2写法await request('B')}return {getB}
}