创建期:
beforeCreate:创建前回调
created:对象创建完成的时候回调。
挂载期:
beforeMount:
mounted:页面显示完成的时候回调
更新期:
beforeUpdate:
update:页面更新完成后回调
销毁期:
beforeDestroy:
destoryed:viewnode从内存销毁完成后回调
<body>
<div id="app">
<h1>{{num}}</h1>
<input type="button" value="+" @click="update" />
<input type="button" value="destory vm" @click="destroyVM">
</div>
<script src="bower_components/vue/dist/vue.js"></script>
<script>
(function () {
new Vue({
el:"#app",
data:{
num:0
},
methods:{
update(){
this.num++
},
destroyVM(){
//this.$mount()
this.$destroy()
}
},
beforeCreate(){
console.log("#1 beforeCreate")
},
created(){
console.log("#2 created")
},
beforeMount(){
console.log("#3 beforeMount")
},
//dom 生成 vnode->dom - el ready
mounted(){
console.log("#4 mounted")
},
beforeUpdate(){
console.log("#5 beforeUpdate")
},
updated(){
console.log("#6 updated")
},
beforeDestroy(){
console.log("#7 beforeDestroy")
},
destroyed(){
console.log("#8 destroyed")
}
})
})()
</script>
</body>