Vue生命周期

每个 Vue 实例在被创建之前都要经过一系列的初始化过程。例如，实例需要配置数据观测(data observer)、编译模版、挂载实例到 DOM ，然后在数据变化时更新 DOM 。在这个过程中，实例也会调用一些 生命周期钩子 ，这就给我们提供了执行自定义逻辑的机会。

var lifecycle = new Vue({
        el: "#app",
        data: {
            name: "wheat"
        },
        //在组件实例创建之前调用，组件属性计算之前，如data属性
        beforeCreate: function () {
            console.log("created")
        },
        //在实例创建之后调用。初始化了数据绑定（data observer），绑定属性，初始计算属性，方法（init events），watcher/事件回调。
        //但DOM还没生成，$el 属性还不存在,但是实例存在,即this.name存在,可打印出来 。
        created: function () { 
            console.log("created")
        },
        //模板编译/挂载之前
        beforeMount: function () {
            console.log("未开始编译 beforeCompile")
        },
        //模板编译/挂载之后。此时所有的指令已生效，因而数据的变化将触发 DOM 更新。
        //但是不保证 组件（$el） 已插入document。
        mounted: function () { 
            console.log("编译完成 compiled")
        },
        //组件更新之前
        beforeUpdate: function () {
            console.log("组件更新之前 beforeUpdate")
        },
        //组件更新之后
        Updated: function () {
            console.log("组件更新之后 Updated")
        },
        //组件被激活时调用
        activated: function () {
            console.log("组件被激活时调用 activated")
        },
        //组件被移除时调用
        deactivated: function () {
            console.log("组件被移除时调用 deactivated")
        },
        //在开始销毁实例时调用。此时实例仍然有功能。
        beforeDestroy: function () {  
            console.log("销毁前 beforeDestroy")
        },
        //在实例被销毁之后调用。此时所有的绑定和实例的指令已经解绑，注意是解绑不是销毁,所有的子实例也已经被销毁。
        destroyed: function () {   
            console.log("已销毁 destroyed")
        },
        //组件方法
        methods: function () {
        },
        //计算属性
        computed: function () {
        },
        //观察属性变化
        watch: function () {
        },
});

参考资料：
Vue 实例
Vue2.0 探索之路——生命周期和钩子函数的一些理解
Vue 实例中的生命周期钩子详解