Files
vue-ts-example-2025/src/pages/demos/i18n-demo.page.vue
严浩 86920da611
All checks were successful
CI/CD Pipeline / playwright (push) Successful in 2m17s
CI/CD Pipeline / build-and-deploy (push) Successful in 1m50s
refactor: update component names to PascalCase and improve structure
- Changed component names from kebab-case to PascalCase in various files for consistency.
- Updated `<router-view>` and `<transition>` to `<RouterView>` and `<Transition>` respectively in App.vue and base-layout.vue.
- Refactored AppNaiveUIProvider.vue to use PascalCase for Naive UI providers.
- Adjusted language and theme switch buttons to use PascalCase for icon components.
- Updated button components in demo pages to use PascalCase for Naive UI buttons.
- Modified ESLint rules in route message files to use perfectionist/sort-objects for better key sorting.
- Enhanced Vite plugin files to export loadPlugin functions for better plugin management.
- Improved plugin loading logic to handle errors and warnings more effectively.
2025-12-10 22:52:23 +08:00

38 lines
1.0 KiB
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">
<NH1>{{ t('page.i18n-demo.title') }}</NH1>
<NCard :title="t('page.i18n-demo.change-language')">
<NP>
{{ t('page.i18n-demo.current-language') }}:
<span class="font-bold">{{ locale }}</span>
</NP>
<NP>
{{ t('page.i18n-demo.hello', { name: 'Kilo' }) }}
</NP>
<NSpace>
<NButton type="primary" @click="setLocale('en-US')"> English </NButton>
<NButton type="success" @click="setLocale('zh-CN')"> 简体中文 </NButton>
</NSpace>
</NCard>
<!-- 这里响应式有问题: -->
<NP> $route.meta.title: {{ $route.meta.title }} </NP>
<!-- 这样才正常 -->
<NP>
routeI18nInstance.global.t($route.name): {{ routeI18nInstance.global.t($route.name) }}
</NP>
</div>
</template>