mirror of https://github.com/nuxt/nuxt.git
55 lines
1.0 KiB
Vue
55 lines
1.0 KiB
Vue
<template>
|
|
<div>
|
|
<div v-if="count > 2">
|
|
count is above 2
|
|
</div>
|
|
<slot />
|
|
{{ data }}
|
|
<div id="long-async-component-count">
|
|
{{ count }}
|
|
</div>
|
|
{{ headers['custom-head'] }}
|
|
<slot
|
|
name="test"
|
|
:count="count"
|
|
/>
|
|
<p>hello world !!!</p>
|
|
<slot
|
|
v-for="(t, index) in 3"
|
|
name="hello"
|
|
:t="t"
|
|
>
|
|
<div :key="t">
|
|
fallback slot -- index: {{ index }}
|
|
</div>
|
|
</slot>
|
|
|
|
<slot
|
|
v-for="(t, index) in ['fall', 'back']"
|
|
name="fallback"
|
|
:t="t"
|
|
>
|
|
<div :key="t">
|
|
{{ t }} slot -- index: {{ index }}
|
|
</div>
|
|
<div
|
|
:key="t"
|
|
class="fallback-slot-content"
|
|
>
|
|
wonderful fallback
|
|
</div>
|
|
</slot>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { getResponseHeaders } from 'h3'
|
|
defineProps<{
|
|
count: number
|
|
}>()
|
|
|
|
const evt = useRequestEvent()
|
|
const headers = evt ? getResponseHeaders(evt) : {}
|
|
const { data } = await useFetch('/api/very-long-request')
|
|
</script>
|