vue 3.2.47 国际化配置

Vue 3.2.47版本的国际化配置通常通过Vue I18n库来进行。以下是基本的步骤：

1. **安装依赖**：首先需要安装`vue-i18n`库，可以使用npm或yarn命令：

   npm install vue-i18n @vue/composition-api --save
   # 或者
   yarn add vue-i18n @vue/composition-api

2. **创建i18n实例**：在项目入口文件（如main.js）中，创建一个新的VueI18n实例，并配置语言源、提供数据等：

   import { createApp } from 'vue'
   import { useI18n } from 'vue-i18n'
   import { defineMessages } from 'vue-i18n'

   // 创建语言资源对象
   const messages = defineMessages({
     hello: {
       en: 'Hello',
       zh-CN: '你好'
     }
   })

   // 初始化i18n
   const i18n = new VueI18n({
     locale: 'en', // 当前语言，默认英语
     fallbackLocale: 'zh-CN', // 默认切换到的语言
     messages,
   })

   createApp(App).use(i18n).mount('#app')

3. **在组件中使用国际化**：在组件内通过`$t`方法访问翻译好的文本：

   <template>
     <div>{{ $t('hello') }}</div>
   </template>

4. **动态改变语言**：你可以根据需求设置用户偏好或路由信息来动态切换语言：

   const changeLanguage = (locale) => {
     i18n.locale = locale
   }

   // 使用时调用
   changeLanguage('zh-CN')