写在前言

Vue的实例是Vue框架的入口，其实也就是前端的ViewModel它包含了页面中的业务逻辑处理、数据模型等，当然它也有自己的一系列的生命周期的事件钩子，辅助我们进行对整个Vue实例生成、编译、挂着、销毁等过程进行js控制。

什么是生命周期

每个Vue实例创建时，都会经历一系列的初始化过程，同时也会调用相应的生命周期钩子，我们可以利用这些钩子，在合适的时机执行我们的业务逻辑。熟悉jQuery的小伙伴，一定知道它的ready()方法比如以下示例：

$(document).ready(function(){

        // DOM 加载完成后，会执行这里的代码

});

Vue的生命周期钩子与之类似，比较常用的有：

• created 实例创建完成后调用，此阶段完成了数据观测等，但尚未挂载，$el还不可用。需要初始化处理一些数据时会比较有用

• mounted el挂载到实例上后调用，一般我们的第一个业务逻辑会在这里开始

• beforeDestroy 实例销毁之前调用。主要解绑一些使用使用addEventListener监听的事件等。

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

在Vue的整个生命周期中，它提供了一系列的事件，可以让我们注册js方法，可以让我们达到控制整个过程的目的地值得注意的是，在这些事件响应方法中的this直接指向的是vue的实例

下面是Vue生命周期的示例图，更清晰的观察整个生命周期便于了解