vue生命周期详解

vue的生命周期主要目的就是让每一个vue实例在不同阶段监听不同的方法，通过生命周期可以明确表现出vue实例在创建前后，挂载前后，更新前后，吊销前后的不同钩子函数
官方文档表达的可能不是很清晰易懂，
现在为大家详解一下生命周期

beforeCreate/created (实例加载前/实例加载后)

此时做的是将vue实例在加载前后所打印出来的东西，($el指的是vue实例中的属性，可以在控制台查看)

打印出来的beforeCreate是两个undefined证明此时vue的实例还没有创建出来
打印出来的created是一个undefined一个值，说明此时虽然实例被创建出来data中的数据已经可以使用了但是 el的标签还没有挂载到页面上面

beforeMount()/mounted() (挂载前/挂载后)


虽然打印结果是一样的但是在beforeMount()中 只是触发了 render function 配置了虚拟DOM
但是页面还没有显示任何东西，在Mounted()中是将el中的DOM节点替换成了vm.$el页面呈现效果之后,

beforeUpdate()/updated() (数据更新前/更新后)

我们都知道data数据变化会影响DOM的重新渲染，
在beforeUpdate()中 主要监听得是 数据变化后，DOM渲染前要做什么
而update()中，指的是数据变化后 DOM也重新渲染之后要做什么

beforeDestory()/destroyed() (实例销毁前/销毁后)

这个生命周期主要就是在vue实例被完全销毁的过程中触发的函数