vue3で親コンポーネントで非同期処理が終わってから子コンポーネントの処理を行いたい時のメモ

#結論
親コンポーネントの処理が終わったらv-ifで子コンポーネントを有効にする。

親.vue

<template>
  <子コンポーネント v-if="mount"/>
</template>

<script lang="ts">
export default {
  setup() {
    const mount = ref<boolean>(false)
    親コンポーネントの非同期処理().then(() => mount.value = true)
    return { mount }
  }
}
</script>

#その他
・v-showは表示されていないだけでコンポーネントは生成されるため、非同期処理の完了を待たずに実行される。
・Vue3の新機能suspenseを使うとv-showと同じような動作となる。
・setup関数をasyncにして非同期処理をawaitにすると表示されない(親コンポーネントでsuspenseを使う必要がある？）