vue中父级与子组件生命周期的先后顺序

<script>
import expressService from ‘@/components/expressService‘
export default {
  components: {
    expressService
  },
  beforeCreate() {
    const time = (new Date()).getTime()
    console.group(‘beforeCreate父级 实例初始化进行数据观测/事件配置‘, time)
  },
  created() {
    const time = (new Date()).getTime()
    console.log(‘created父级 实例创建完成‘, time)
  },
  beforeMount() {
    const time = (new Date()).getTime()
    console.group(‘beforeMount父级 挂载开始‘, time)
  },
  mounted() {
    const time = (new Date()).getTime()
    console.log(‘mounted父级 挂载到实例上‘, time)
  },
  beforeUpdate() {
    const time = (new Date()).getTime()
    console.group(‘beforeUpdate父级 数据更新前‘, time)
  },
  updated() {
    const time = (new Date()).getTime()
    console.log(‘updated父级 组件DOM更新‘, time)
  },
  beforeDestroy() {
    const time = (new Date()).getTime()
    console.log(‘updated父级‘, time)
    console.group(‘beforeDestroy父级 实例销毁前‘, time)
  },
  destroyed() {
    const time = (new Date()).getTime()
    console.log(‘destroyed父级 实例销毁完成‘, time)
  }
}
</script>

<template>
  <div class="expressService">
    子级生命周期
  </div>
</template>

<script>
export default {
  beforeCreate() {
    const time = (new Date()).getTime()
    console.group(‘beforeCreate子级‘, time)
  },
  created() {
    const time = (new Date()).getTime()
    console.log(‘created子级‘, time)
  },
  beforeMount() {
    const time = (new Date()).getTime()
    console.group(‘beforeMount子级‘, time)
  },
  mounted() {
    const time = (new Date()).getTime()
    console.log(‘mounted子级‘, time)
  },
  beforeUpdate() {
    const time = (new Date()).getTime()
    console.group(‘beforeUpdate子级‘, time)
  },
  updated() {
    const time = (new Date()).getTime()
    console.log(‘updated子级‘, time)
  },
  beforeDestroy() {
    const time = (new Date()).getTime()
    console.group(‘beforeDestroy子级‘, time)
  },
  destroyed() {
    const time = (new Date()).getTime()
    console.log(‘destroyed子级‘, time)
  }
}
</script>