生命周期图
上图生命周期每个红色的钩子是一个阶段，可以在每个不同的阶段写合适的代码。
生命周期函数
生命周期分为四个对子，根据不同的情况使用不同的函数
其中beforeUpdate、updated能执行多次
| beforeCreate、created | 创建前、创建后 |
| beforeMount、mounted | 挂载前、挂载后 |
| beforeUpdate、updated | 更新前、更新后 |
| beforeDestroy、destroyed | 销毁前、销毁后 |
下面的四种应用场景用的统一HTML代码
<div id="app"> {{myName}} </div>
beforeCreate和created的区别
创建前、创建后
beforeCreate创建前应用场景
vue代码：
var app = new Vue({ el: '#app', data() { return { myName:'abc', } }, beforeCreate(){ //获取body并输出测试 var bodyDom=document.getElementsByTagName("body")[0].innerHTML; console.log("created",this.myName,bodyDom); } });
浏览器输出结果：
beforeCreate中data的数据是没有被定义的，created后面是undefined并且{{myName}}还未被识别
