Vue的生命周期

created() {
    console.log(this.name);
  },

   1.beforeCreate

在这个阶段进行初始化methods的方法,和data里面的变量做准备,无法进行使用。

export default {
   data() {
       return {
        name:'李四'
       }
   },
   beforeCreate(){
    console.log(this.name);
   },
  components: {}
}

Vue的生命周期_第1张图片

2.Created

created() {
    console.log(this.name);
  },

Vue的生命周期_第2张图片

初始化阶段完毕,可以使用方法和变量。

3.  beforeMount

 
beforeMount() { console.log(this.$refs.aa); },

 在这个阶段不能获取真实的dom

4.  mounted

 mounted(){
       console.log(this.$refs.aa);
  },

可以获取真是的dom

Vue的生命周期_第3张图片

5.   beforeUpdate  updated

更新前做准备

跟新完成后

6.  beforeDestroy 

销毁前做准备 任然能使用

7.destroyed

完全销毁

组件从诞生到消亡的全过程叫做组件的生命周期。

 

你可能感兴趣的:(Vue,vue.js,前端,javascript)