cleanup nuxt demo

Author: zernonia

demo/nuxt/pages/index.vue

@@ -1,6 +1,4 @@
 <script setup lang="ts">
-import { useNuxtApp } from "#app"
-
 const { $notion } = useNuxtApp()
 const { data } = await useAsyncData("notion-index", () => $notion.getPageBlocks("4b2dc28a5df74034a943f8c8e639066a"))
 const { mapPageUrl, pageLinkOptions } = useProps()

demo/nuxt/pages/page/[id].vue

@@ -1,14 +1,15 @@
 <script setup lang="ts">
-import { useNuxtApp } from "#app"
-
 const route = useRoute()
 const { $notion } = useNuxtApp()
-const { data } = await useAsyncData(`notion-${route.params.id}`, () => $notion.getPageBlocks(route.params.id))
+const { data, pending } = useLazyAsyncData(`notion-${route.params.id}`, () =>
+  $notion.getPageBlocks(route.params.id.toString())
+)
 const { mapPageUrl, pageLinkOptions } = useProps()
 </script>
 
 <template>
-  <div>
+  <div v-if="pending" class="notion">Loading...</div>
+  <div v-else>
     <NotionRenderer :blockMap="data" fullPage prism katex :mapPageUrl="mapPageUrl" :pageLinkOptions="pageLinkOptions" />
   </div>
 </template>