在单一组件中,钩子的执行顺序是beforeCreate-> created -> mounted->… ->destroyed,但当父子组件嵌套时,父组件和子组件各拥有各自独立的钩子函数,这些父子组件的这些钩子是如何交融执行,且执行顺序又是怎样的呢?
组件,分别在他们的钩子函数中打印日志,观察执行顺序。得到的结果如图所示,父组件先创建,然后子组件创建;子组件先挂载,然后父组件挂载。
父beforeCreate-> 父create -> 子beforeCreate-> 子created -> 子mounted ->
父mounted
自组件挂载完成后,父组件还没有挂载,所以在组件数据更新视图时,父组件mounted里面获取的api数据,子组件的mounted是拿不到的是拿不到的。
仔细看看父子组件生命周期钩子的执行顺序,会发现created这个钩子是按照从外内顺序执行,所以父子组件传递接口数据的解决方案是:
在父组件created中发起请求获取数据,依次在子组件的created或者mounted中会接收到这个数据。
加载渲染过程
父beforeCreate->父created->父beforeMount->子beforeCreate->子created->子beforeMount->子mounted->父mounted
复制代码更新过程
父beforeUpdate->子beforeUpdate->子updated->父update