vue的父子组件生命周期怎么走的

Vue.js 中的父子组件生命周期指的是组件从创建到销毁过程中的一些关键阶段，它们分别对应着组件的不同状态和操作。以下是父子组件的典型生命周期流程：

**子组件（Child Component）生命周期方法：**
1. **created()**: 子组件实例被创建后立即执行，但在此之前模板可能尚未挂载。
2. **beforeMount()**: 在挂载开始之前调用，此时数据已经绑定到了 DOM 结构上，但是 DOM 还未插入文档中。
3. **mounted()**: 组件实际插入到 DOM 中并挂载完成。在这个阶段，$el (元素节点) 可用。
4. **beforeUpdate()**: 当数据变化导致重新渲染之前调用，但DOM没有更新。
5. **updated()**: 数据更新之后调用，这时DOM已经被更新了。
6. **beforeDestroy()**: 组件将被卸载前调用，但在此之后不再响应事件或数据修改。
7. **destroyed()**: 组件已完全卸载，所有属性和方法已被重置。

**父组件（Parent Component）的生命周期方法：**
1. **created()**: 类似于子组件，父组件实例创建后执行。
2. **beforeCreate()**: 仅当子组件存在时会被调用，用于初始化阶段。
3. **beforeMount()**: 对于每个子组件，都会触发父组件的这个阶段。
4. **mounted()**: 同样，对每个子组件，父组件会进入此阶段，表示挂载完毕。
5. **beforeUpdate()**: 如果子组件的数据发生变化，父组件会先经历这个阶段。
6. **updated()**: 数据更新后，父组件的视图已更新。
7. **beforeDestroy()**: 子组件卸载前，父组件也会经历这个阶段。
8. **destroyed()**: 父组件本身也被卸载。

**父子间的生命周期关联：**
- 父组件调用`this.$mount()`后，它的`mounted()`方法会在所有子组件`mounted()`方法完成后调用。
- 当子组件数据变化引发更新时，父组件会根据这些变化调用自己的生命周期方法。

**注意点：**
- 子组件的生命周期方法只有在父组件实例创建后才会执行。
- 父组件不会监控单个子组件的`destroyed()`，但可以通过watchers监听整个子组件树的变化。