AsyncComponent.vue

<template>
    <h2>Latest News</h2>
    <p>{{ news }}</p>
</template>

<script>
    export default {
        async setup(props, context) {
            const promise = new Promise((resolve) => {
                setTimeout(function () {
                    context.emit("newscomplete");
                    resolve("Trump resigns");
                }, 2000)
            });

            const news = await promise;
            return {
                news
            }
        }
    }
</script>

CompUsingSuspense.vue

<template>
  <div id="app">
    <img alt="Vue logo" src="./assets/logo.png">
    <Fragments />
    <Suspense>
      <template #default>
        <LatestNews @newscomplete="newscomplete" />
      </template>
      <template #fallback>
        <div>Loading...</div>
      </template>
    </Suspense>

  </div>
</template>