Vue生命周期钩子函数：
beforeCreate函数：
在实例初始化之后，数据观测(data observer) 和 event/watcher 事件配置之前被调用。
created函数：
在实例创建完成后被立即调用，在这一步，实例已完成一下的配置：数据观测(data observer)，属性和方法的运算，watch/event 事件回调。然而，挂载阶段还没开始，$el 属性目前不可见。
beforeMount函数：
在挂载开始之前被调用：相关的render函数首次被调用，该钩子在服务器端渲染期间不可被调用。
mounted函数：
在挂载开始之后被调用。
beforeUpdate函数：
数据更新时调用，该钩子在服务器端渲染期间不被调用，因为只有初次渲染会在服务端进行。
updated函数：
由于数据更改导致的虚拟DOM重新渲染和打补丁，在这之后会调用该钩子。
beforeDestroy函数：
实例销毁之前调用，在这一步，实例仍然完全可用，该钩子在服务器端渲染期间不被调用。
destroy函数：
Vue实例销毁后调用，调用后，Vue实例指示的所有东西都会解绑定，所有的事件监听器会被移除，所有的子实例也会被销毁，该钩子在服务器渲染期间不被调用。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <div id="d1"> <p>{{name}}</p> </div> <script src="vue.js"></script> <script> var app = new Vue({ el:"#d1", data:{ name:"qingqiu", }, //数据属性的声明： beforeCreate:function(){ console.log("这是beforeCreate钩子函数"); console.log(this.name) }, created:function () { console.log("这是created钩子函数"); console.log(this.name); }, // 挂载之前表示：没有将data中的数据内容渲染到Vue实例中 beforeMount:function () { console.log("这是beforeMount钩子函数"); console.log(document.getElementById("d1").innerText) }, // 挂载之后表示：将data中的数据内容渲染到Vue实例中 mounted:function(){ console.log("这是mounted钩子函数"); console.log(document.getElementById("d1").innerText); } }) </script> </body> </html>