<div id="app">
<p>{{num}}</p>
</div>
<script>
var vm = new Vue({
el:"#app",
data:{
num: 10,
},
beforeCreate(){
// vm对象创建执行的方法
console.log("vm对象创建之前");
console.log( this.$el);
console.log( this.$num);
},
created(){
// vm 对象创建以后执行的方法
console.log("vm对象创建之后");
console.log( this.$el); //此时vm 对象还没用初始化完成,所以没有把data挂在标签指令中
console.log( this.$num);
},
beforeMount(){
// vm 对象创建以后,挂载数据之前
console.log("vm对象创建以后,执行指令之前");
console.log( this.$el);
},
mounted(){
// vm 对象挂载数据之后
console.log("vm对象创建之前");
console.log( this.$el);
}
// 上面四个都是在创建vm 的时候进行初始化过程中自动调用的
// 工作中,会在created或者mounted里面编写ajax 代码去服务器端获取数据
// 如果这些数据不能涉及到修改HTML代码的,则Ajax写在created里面
// 理论上来说,ajax代码提取数据肯定是越早越好
})
</script>