<template>

  <div></div>

</template>

<script>

export default {

  //生命周期函数就是vue实例再某一时间点会自动执行的函数

  data() {

    return {}

  },

  components: {},

  methods: {},

  beforeCreate() {

    console.log('beforecreate')

  },

  created() {

    console.log('created')

  },

  beforeMount() {

    //被执行时页面还没有被渲染

    console.log(this.$el)

    console.log('beforeMount')

  },

  mounted() {

    //被执行的时候页面已经被渲染完毕了

    console.log(this.$el)

    console.log('mounted')

  },

  beforeDestroy() {

    //当组件被销毁时才会触发

    console.log('beforeDestory')

  },

  destroyed() {

    //当组件被完全销毁时会触发

    console.log('detory')

  },

  beforeUpdate() {

    //当数据发生改变还没被重新渲染之前执行

    console.log('beforeUpdate')

  },

  updated() {

    //当数据发生改变被重新渲染之后执行

    console.log('updated')

  }

}

</script>