Vue3、Composition APIのライフサイクルデバッグ用

下記ファイル(Log.js)のdebugLifeCycleを、各Vueのsetup関数の中で呼ぶ

import { onBeforeMount, onMounted, onBeforeUpdate , onUpdated, onBeforeUnmount, onUnmounted} from 'vue'

function debugLifeCycle(view) {

    console.log(view + ":  on create")

    onBeforeMount(() => {
      console.log(view + ":  on before mount")
    })

    onMounted(() => {
      console.log(view + ":  on mount")
    })

    onBeforeUpdate(() => {
      console.log(view + ":  on before update")
    })

    onUpdated(() => {
      console.log(view + ":  on update")
    })

    onBeforeUnmount(() => {
      console.log(view + ":  on before unmounted")
    })

    onUnmounted(() => {
      console.log("on unmounted")
    })
}

export default {
    debugLifeCycle
};