<body>
<div id="app" >
{{myName}}
<button @click="add">加1</button>
<button @click="bye">点击摧毁vm</button>
</div>
</body>
<script src="../js/vue2.7.js"></script>
<script>
var app=new Vue({
el:"#app",
data(){
return{
myName:1,
}
},
methods:{
add(){
console.log("add");
this.myName++
},
bye(){
console.log("摧毁已启动");
//调用摧毁流程启动
this.$destroy()
}
},
beforeCreate(){
console.log("beforCreate",this.myName);
},
created(){
console.log("created",this.myName);
},
beforeMount(){
console.log("beforeMount",this.myName);
},
mounted(){
console.log("mounted",this.myName);
},
beforeUpdate(){
console.log("beforeUpdate",this.myName);
},
updated(){
console.log("updated",this.myName);
},
beforeDestroy(){
console.log("beforeDestroy",this.myName);
},
destroyed(){
console.log("destroyed",this.myName);
}
})
</script>
