vue生命周期

vue 在 生 命 周 期 中 有 这 些 状 态 ： beforeCreate,created,beforeMount,mounted,beforeUpdate,updated,beforeDestroy,destroyed。

// An highlighted block
var vm = new Vue({ el : "#app", data : {
message : 'hello world'
},
beforeCreate : function() { console.log(this);
showData('创建vue实例前-beforeCreate', this);
},
created : function() {
showData('创建vue实例后-created', this);
},
beforeMount : function() {
showData('挂载到dom前-beforeMount', this);
},
mounted : function() {
showData('挂载到dom后-mounted', this);
},
beforeUpdate : function() {
showData('数据变化更新前-beforeUpdate', this);
},
updated : function() {
showData('数据变化更新后-updated', this);
},
beforeDestroy : function() { vm.test = "3333";
showData('vue实例销毁前-beforeDestroy', this);
},
destroyed : function() {
showData('vue实例销毁后-destroyed', this);
}
});


function realDom() {
console.log('真实dom结构：' + document.getElementById('app').innerHTML);
}

function showData(process, obj) { console.log(process); console.log('data 数据：' + obj.message)
onsole.log('挂载的对象：')
console.log(obj.$el) realDom();
console.log('	')
console.log('	')
}