复习概念

先来复习一下父子孙组件生命周期的执行逻辑。

父组件组件实例创建setup()执行 ➡ 父组件onBeforeMount()钩子函数执行，想要进行组件挂载，发现DOM中有个儿子需要先挂载，于是跑去挂载子组件。（子组件未完成挂载，父组件onMounted还没执行）
子组件组件实例创建setup()执行 ➡ 子组件onBeforeMount()钩子函数执行，也想要进行组件挂载，发现DOM中有两个孙子需要先挂载，于是跑去挂载两个孙组件。（子组件未完成挂载，子组件onMounted还没执行）
孙子有两个，孙子2号说，要先来后到我先加载，于是孙子2号实例创建setup()执行➡ onBeforeMount()钩子函数执行，孙子2号说：”ok，我没有子组件了，我要挂载了“，但是尤雨溪说：”不行，你要等你的兄弟同步组件准备好再挂载。“（同步组件未准备，孙子2号组件onMounted还没执行）
于是孙子3号实例创建setup()执行➡ onBeforeMount()钩子函数执行，孙子3号说：“行！我也没有子组件，我要先挂载了，我受不了。”，这时正义的尤大站了出来，说： ”不行，孙子2号让了你，你也要礼让它。“（同步组件未完成挂载，孙子3号组件onMounted还没执行）
有了尤大的撑腰，孙子2号身板挺得老直了，手不忙脚不乱的把自己的DOM信息放到父容器中并执行onMounted钩子函数。其他组件也不敢违抗尤大的旨意，按部就班地放好自己的DOM信息，执行onMounted钩子函数，完成组件自己的加载流程。

遇到的问题

我让父组件在挂载前去请求数据然后传给子组件，可是子组件挂载的时候数据还没请求完。

父组件中请求数据的函数放在onBeforeMount中，子组件首次挂载时，父组件传过来的数据是空的导致报错，也就是说，这个时候异步的数据请求还未完成。

解决方案

使用v-if进行条件渲染，在父组件中，使用 v-if 来确保子组件在数据准备好之前不会被渲染。