Nuxt/test/fixtures/basic/pages/index.vue
Julien Huang 2cdaf8065c
feat(nuxt): remove wrapper from client only components (#6165)
Co-authored-by: Daniel Roe <daniel@roe.dev>
2022-08-02 17:05:02 +02:00

41 lines
970 B
Vue

<template>
<div>
<Head>
<Title>Basic fixture</Title>
</Head>
<h1>Hello Nuxt 3!</h1>
<div>RuntimeConfig | testConfig: {{ config.testConfig }}</div>
<div>Composable | foo: {{ foo }}</div>
<div>Composable | bar: {{ bar }}</div>
<div>Composable | template: {{ templateAutoImport }}</div>
<div>Path: {{ $route.fullPath }}</div>
<NuxtLink to="/">
Link
</NuxtLink>
<SugarCounter :count="12" />
<CustomComponent />
<component :is="`test${'-'.toString()}global`" />
<component :is="`with${'-'.toString()}suffix`" />
<ClientWrapped ref="clientRef" style="color: red;" class="client-only" />
</div>
</template>
<script setup>
import { useRuntimeConfig } from '#imports'
const config = useRuntimeConfig()
// reset title template example
useHead({
titleTemplate: null
})
const foo = useFoo()
const bar = useBar()
const clientRef = ref()
onMounted(() => {
clientRef.value.exposedFunc()
})
</script>