Vue的生命周期

1.生命周期

Vue 实例从创建到销毁的过程，就是生命周期。也就是从开始创建、初始化数据、 编译模板、挂载 Dom→渲染、更新→渲染、卸载等一系列过程，我们称这是 Vue 的生命周期。

2.生命周期过程

四个阶段，八个钩子函数

1）数据挂载 阶段 ：把传入的data属性的内容（data配置项），赋给vue对象。即：把形参中data的属性赋给vue对象。

前后分别的钩子函数是：beforeCreate、created

2）模板渲染阶段：把vue对象中data渲染到dom对象上（模板上，视图上）。

前后分别的钩子函数是：beforeMount、mounted

3）组件（模板）更新阶段：当数据（必须是在模板上使用的数据）发生变化时，会触发组件的更新，组件会重新渲染。

前后分别的钩子函数是：beforeUpdate、updated

4）组件销毁阶段：

前后分别的钩子函数是：beforeDestroy、destroyed

3.生命周期的作用

生命周期中有多个事件钩子，让我们在控制整个 Vue 实例的过程时更容易完成指定
逻辑。每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如，需要设置
数据监听、编译模板、将实例挂载到 DOM 并在数据变化时更新 DOM 等。同时在
这个过程中也会运行一些叫做生命周期钩子的函数，这给了用户在不同阶段添加自
己的代码的机会。（ps：生命周期钩子就是生命周期函数）例如，如果要通过某些插
件操作 DOM 节点，如想在页面渲染完后弹出广告窗，那我们最早可在 mounted
中进行

4.DOM 渲染在哪个生命周期阶段内完成

DOM 渲染在 mounted 中就已经完成了，原因：在 created 的时候，视图中的
html 并没有渲染出来，所以此时如果直接去操作 html 的 dom 节点，一定找不到
相关的元素，而在 mounted 中，由于此时 html 已经渲染出来了，所以可以直接操
作 dom 节点。

5.生命周期图片过程图片