- beforeCreate
- created
Vue实例已经创建完成,但尚未挂载,vm.$el
不可访问 - beforeMount
- render
- mounted
Vue实例已挂载,可访问vm.$el
- beforeUpdate
- updated
- beforeDestroy
- destroyed
import Vue from "vue";
import Helloworld from "./src/helloworld.vue";const data = {a:"hello",b:"world"
}
const vm = new Vue({data:data,beforeCreate:function(){console.log("enter beforeCreate");},created:function(){ console.log("enter created",", get $el:",this.$el);},beforeMount:function(){console.log("enter beforeMount")},render:(h) => {console.log("enter render");return h(Helloworld);},mounted:function(){console.log("enter mounted",", get $el:",this.$el);}
}).$mount("#root");
生命周期函数里慎用箭头函数
import Vue from "vue";
import Helloworld from "./src/helloworld.vue";const data = {a:"hello",b:"world"
}
const vm = new Vue({data:data,render:(h) => h(Helloworld),mounted:function(){console.log(this);}
}).$mount("#root");