nuxt3 i18n

Nuxt.js 3.x 中的 i18n（国际化）是一个用于实现多语言支持的功能模块。在 Nuxt 3 中，你可以通过引入 `@nuxtjs/i18n` 插件轻松地集成国际化功能到你的应用中。以下是使用 Nuxt 3 i18n的基本步骤：

1. 安装插件：
在项目根目录下运行 `npm install @nuxtjs/i18n` 或者 `yarn add @nuxtjs/i18n`。

2. 配置文件（通常是 `nuxt.config.js`）：

   import { createI18n } from '@nuxtjs/i18n'
   
   export default {
     // 其他配置...
     i18n: createI18n({
       locales: ['en', 'fr'], // 支持的语言列表
       defaultLocale: 'en', // 默认语言
       fallbackLocale: 'en', // 当检测不到用户首选语言时使用的备选语言
     }),
   }

3. 使用国际化的组件和路由：
- 在组件中，可以使用 `this.$i18n.t()` 函数访问翻译文本，例如 `{{ this.$t('greeting') }}`。
- 对于路由，可以在路由选项中设置 `name` 属性，如 `{ name: 'home', meta: { title: this.$t('home.title') } }`。

4. 动态切换语言：
用户可以通过 URL 查询参数、cookies 或者前端 UI 来切换语言。Nuxt 提供了钩子函数 `beforeRouteUpdate` 和 `asyncData` 可以监听语言更改并更新内容。