mirror of
https://github.com/nuxt/nuxt.git
synced 2024-11-11 08:33:53 +00:00
afcaaff57d
Co-authored-by: Daniel Roe <daniel@roe.dev> Co-authored-by: Pooya Parsa <pyapar@gmail.com>
31 lines
924 B
Vue
31 lines
924 B
Vue
<script setup lang="ts">
|
|
// see ../compoables/locale.ts for the implementation
|
|
const locales = useLocales()
|
|
const locale = useLocale()
|
|
const date = useLocaleDate(new Date('2016-10-26') /* NUXT_BIRTHDAY */)
|
|
</script>
|
|
|
|
<template>
|
|
<NuxtExampleLayout :show-tips="true" example="locale">
|
|
<h1 class="text-xl opacity-50">
|
|
Nuxt birthday
|
|
</h1>
|
|
<p class="text-4xl">
|
|
{{ date }}
|
|
</p>
|
|
<div class="mt-4" />
|
|
<label for="locale-chooser">Preview a different locale</label>
|
|
<select id="locale-chooser" v-model="locale" class="m-auto w-50 border n-border-base rounded p-1">
|
|
<option v-for="l of locales" :key="l" :value="l">
|
|
{{ l }}
|
|
</option>
|
|
</select>
|
|
|
|
<template #tips>
|
|
<div>
|
|
You can right click to "View Page Source" and see that Nuxt renders the correct date in SSR based on visitor's locale.
|
|
</div>
|
|
</template>
|
|
</NuxtExampleLayout>
|
|
</template>
|