vue基础part9
vue声明周期
对vue生命周期简单了解
初始化阶段
? beforeCreate
? Created
? beforeMount
? mounted
数据更新阶段
? beforeUpdate
? updated
销毁
? beforeDestroy
? destroyed
代码说明：
页面显示按钮控制销毁vue实例 p标签定时（1s）显示在页面上，销毁实例后，不再执行定时任务。按下按钮的那一瞬间，页面如果显示p标签内容，则后续一直显示，如果那一瞬间是消失的，则会一直不显示（display :none）
destroy vm
尚硅谷it教育
定时器任务会返回它的定时器id 通过this可以提升变量的作用域，让它能在beforeDestroy方法中能访问到，直接销毁实例并不会停止定时器，我们仍需要在销毁之前去把清楚定时器
new Vue({
el:'#model',
data:{
isShow:true
},
beforeCreate(){
console.log('beforeCreate')
},
Created(){
console.log('Created')
},
beforeMount(){
console.log('beforeMount')
},
mounted(){
this.instervalId= setInterval(()=>{
console.log('----------------')
this.isShow = !this.isShow
},1000)
},
beforeUpdate(){
console.log('beforeUpdate')
},
updated(){
console.log('updated')
},
beforeDestroy(){
clearInterval(this.instervalId)
console.log('beforeDestroy')
},
destroyed(){
console.log('destroyed')
},
methods:{
destroyVm(){
this.$destroy()
}
}
})
页面控制台打印结果：