vue父组件能否监听子组件的生命周期去做处理

关于父组件监听子组件的生命周期有两种方式：
1.通过this,$emit(），v-on来处理

父组件：
<template>
  <div class="home">
     <h1>我是首页</h1>
     <detail-page @created="handlecreated" @mounted="handlemounted"
     @beforeDestory="hanldebeforeDestory">
     </detail-page>
  </div>
</template>
<script>
import detailPage from '@/views/detail/index.vue'
export default {
  components: {
    detailPage
  },
  methods:{
   handlecreated(data){
       console.log(data);
   },
    handlemounted(data){
       console.log(data);
   },
    hanldebeforeDestory(data){
       console.log(data);
   }
  }
}
</script>

子组件：
<template>
  <div class="wrap">我是详情页</div>
</template>

<script>

export default {
  created(){
      this.$emit("created","我现在处于创建完成阶段");
  },
  mounted(){
      this.$emit("mounted","我现在处于挂载完成阶段");
  },
  beforeDestory(){
      this.$emit("beforeDestory","我现在处于即将销毁阶段");
  }
}
</script>

2.通过（@hook:对应的生命周期）来处理

父组件：
<template>
  <div class="home">
     <h1>我是首页</h1>
     <detail-page @hook:beforeMount="handleProgress">
     </detail-page>
   </div>
</template>
<script>

import detailPage from '@/views/detail/index.vue'
export default {
  components: {
    detailPage
  },
  methods:{
      handleProgress(){
          debugger;
      }
  }
}
</script>