儿童Vue.js组件生命周期

Question

子组件的创建和安装顺序是什么？我知道这里记录了单个组件的生命周期，但是找不到创建和安装子代时描述的任何内容。

例如，以下组件的创建和安装顺序是什么？

<template>
    <div class='parent'>
        <child-1/>
        <child-2/>
        <child-3/>
    </div>
</template>

Answer 1

我发现本文对解释父/子生命周期挂钩执行的顺序特别有帮助。该图尤其提供了该过程的良好摘要。

也看看这个帖子由LinusBorg在vuejs论坛。

• beforeCreate()并created()先运行父项。
• 然后将渲染父级模板，这意味着将创建子级组件。
• 所以现在孩子的beforeCreate()和created()钩子分别执行。
• 这些子组件安装到DOM元素，并调用它们的beforeMount()和mounted()挂钩。
• 并且只有在父模板完成后，才能将父对象安装到DOM，因此最终调用了父对象beforeMount()和mounted()钩子。