清楚父子组件生命周期的执行顺序

项目场景：

提示：这里简述项目相关背景：

---

问题描述

提示：这里描述项目中遇到的问题：
ajax请求返回的数据存放在data中，传递给子组件，请求返回的有数据，但在子组件created打印却是空的

                     //父组件代码页
<template>
  <comDialog :dataInfor="dataInfor" ></comDialog>
</template>
<script>
import comDialog from "../components/dialog.vue";
export default {
    
    
  components: {
    
    
    comDialog
  },
  data() {
    
    
    return {
    
    
      dataInfor: [],
    };
  },
  created() {
    
    
    this.a()
  },
  methods: {
    
    
    a(){
    
    
    //模拟异步请求
      setTimeout(() => {
    
    
        this.dataInfor=[ {
    
     name: "陈梦圆", age: "18", sex: "女",id:1 }]
      },500)
    }
}
</script>


//子组件代码页
<script>
export default {
    
    
  props: {
    
    
    dataInfor: {
    
    },
  },
  data() {
    
    
    return {
    
    
    };
  },
  created() {
    
    
    console.log(this.dataInfor,"aaaaa");//结果为空
   },
  }
  </script>

---

原因分析：

因为请求是异步请求，所以传递给子组件的值是初始值。created打印中的变量初始值是空的。 上精华！
【父子组件生命周期执行顺序
父beforeCreate-> 父create -> 子beforeCreate-> 子created -> 子mounted -> 父mounted->父异步请求 这样就清楚了吧】
再补充一下！！！！！！！！！！！
在异步请求和DOM挂载的先后顺序？
答：我是mounted。
我是mounted里面的nextTick。
我是异步请求。
我是nextTick异步请求。
dom先挂载完毕，然后异步请求再执行。

解决方案：

1.可以在子组件监听这个值。这个在上一篇有说道
2.在在组件标签上加上v-if 并且加上一个开关， 请求返回数据后这个开关为true，当赋值的数据不为空且开关为true时，再渲染子组件。