这是我参与8月更文挑战的第9天，活动详情查看：8月更文挑战”
就像一个人，从出生到死亡会经历童年、少年、青年、中年、老年各个阶段。如果你是上帝，你可以让他童年做着无忧无虑的事情、少年用功读书、青年到处游学、中年娶妻生子、老年儿孙满堂。
Vue.js让你有了上帝之手，可以操纵Vue实例的整个生命周期。\
一、生命周期
每个 Vue 实例在被创建之前都要经过一系列的初始化过程。例如，实例需要：
配置数据观测(data observer)
编译模版、挂载实例到 DOM
在数据变化时更新 DOM
在这个过程中，实例也会调用一些生命周期钩子 ，这就给我们提供了执行自定义逻辑的机会。比如，created 这个钩子在实例被创建之后被调用：
var vm = new Vue({
data: {
a: 1
},
created: function () {
//
this指向 vm 实例console.log('a is: ' + this.a)
}
})
// -> "a is: 1"
也有一些其它的钩子，在实例生命周期的不同阶段调用，如 mounted、 updated 、destroyed 。钩子的 this 指向调用它的 Vue 实例。
二、Vue实例生命周期图示
生命周期中钩子函数介绍：
beforeCreate: function () {
// 在实例初始化之后，数据观测(data observer)
和 event/watcher 事件配置之前被调用。
},
created: function () {
// 实例已经创建完成之后被调用。
在这一步，实例已完成以下的配置：数据观测(data observer)，
属性和方法的运算， watch/event 事件回调。
然而，挂载阶段还没开始，$el 属性目前不可见。
},
beforeCreate: function () {
// 在实例初始化之后，数据观测(data observer) 和 event/watcher
事件配置之前被调用。
},
mounted: function () {
// el 被新创建的 vm.$el 替换，并挂载到实例上去之后调用该钩子。
如果 root 实例挂载了一个文档内元素，当 mounted 被调用时
vm.$el 也在文档内。
},
beforeUpdate: function () {
// 数据更新时调用，发生在虚拟 DOM 重新渲染和打补丁之前。
// 你可以在这个钩子中进一步地更改状态，这不会触发附加的重渲染过程。
},
update: function () {
// 由于数据更改导致的虚拟 DOM 重新渲染和打补丁，在这之后会调用该钩子。
// 当这个钩子被调用时，组件 DOM 已经更新，
所以你现在可以执行依赖于 DOM 的操作。然而在大多数情况下，
你应该避免在此期间更改状态，因为这可能会导致更新无限循环。
},
<keep-alive>包裹动态组件时，会缓存不活动的组件实例，而不是销毁它们。activated: function () {
// keep-alive 组件激活时调用。
},
deactivated: function () {
// keep-alive 组件停用时调用。
},
beforeDestroy: function () {
// 实例销毁之前调用。在这一步，实例仍然完全可用。
},
destroyed: function () {
// Vue 实例销毁后调用。调用后，Vue 实例指示的所有东西都会解绑定，
所有的事件监听器会被移除，所有的子实例也会被销毁。
}
上图中比较常用的钩子：
created：vue实例被生成后的一个生命周期钩子函数。(页面初始化数据加载一般写这里);
beforeCreate：给个loading界面 created撤销loading;
beforeDestory：当移除当前组件的时候调用
destoryed：当前组件已被删除，清空相关内容
