31 lines
799 B
Vue
31 lines
799 B
Vue
<script setup lang="ts">
|
|
definePage({ meta: { order: 1 } });
|
|
const { t, locale } = useI18n({});
|
|
|
|
function setLocale(newLocale: 'en-US' | 'zh-CN') {
|
|
i18nInstance.global.locale.value = newLocale;
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div class="p-4">
|
|
<n-h1>{{ t('page.i18n-demo.title') }}</n-h1>
|
|
|
|
<n-card :title="t('page.i18n-demo.change-language')">
|
|
<n-p>
|
|
{{ t('page.i18n-demo.current-language') }}:
|
|
<span class="font-bold">{{ locale }}</span>
|
|
</n-p>
|
|
|
|
<n-p>
|
|
{{ t('page.i18n-demo.hello', { name: 'Kilo' }) }}
|
|
</n-p>
|
|
|
|
<n-space>
|
|
<n-button type="primary" @click="setLocale('en-US')"> English </n-button>
|
|
<n-button type="success" @click="setLocale('zh-CN')"> 简体中文 </n-button>
|
|
</n-space>
|
|
</n-card>
|
|
</div>
|
|
</template>
|