Nuxt/test/fixtures/basic/pages/server-components/lazy/end.vue

38 lines
743 B
Vue
Raw Normal View History

<script setup lang="ts">
const page = ref<HTMLDivElement | undefined>()
const mountedHTML = ref()
onMounted(() => {
mountedHTML.value = page.value?.innerHTML
})
const lazy = useRoute().query.lazy === 'true'
</script>
<template>
<div
ref="page"
class="end-page"
>
End page
<pre>{{ mountedHTML }}</pre>
<section id="fallback">
<AsyncServerComponent
:lazy="lazy"
:count="42"
>
<template #fallback>
Loading server component
</template>
</AsyncServerComponent>
</section>
<section id="no-fallback">
<AsyncServerComponent
:lazy="lazy"
:count="42"
/>
</section>
<ServerWithClient :lazy="lazy" />
</div>
</template>