vue父组件如何监测多个懒加载的子组件都加载完成了？

Question

vue父组件如何监测多个懒加载的子组件都加载完成了

Answer 1

在父组件中定义一个数组，用来存储所有子组件的配置信息，然后在每个子组件加载完成时，通过$emit方法向父组件传递一个标识属性（如order），父组件接收到后将其加入数组，最后判断数组的长度是否等于子组件的数量

Answer 2

defineAsyncComponent 方法接收一个返回 Promise 的加载函数，ES 模块动态导入也会返回一个 Promise，所以两者可以搭配使用，按道理可以按如下方式写，但我没有实际这么用过，不知道会不会有问题

const StandaloneComponent = defineAsyncComponent(() =>
  import("./Standalone").then((v) => {
    console.log("success"); //可以在这进而通知是否加载完成，所有的组件全部通知到位就可以了
    return v;
  }).catch((error)=>{
    console.log(error)
  })
);

Answer 3

如果是监听组件生命周期的话，最简单的办法就是使用@hook来监听，比如“@hook:mounted=‘listenMounted’