Vue3国际化适配（i18n）的简单使用（非常简单）

Vue-i18n是Vue.js的国际化插件

Vue-i18n官网：Vue I18n | Vue I18n

下载Vue-i18n插件 ：

# npm方式
npm install vue-i18n@9

# yarn方式
yarn add vue-i18n@9

在main.js引入Vue-i18n:

# main.js/main.ts

import { createApp } from 'vue'
import App from './App.vue'
import { createI18n } from 'vue-i18n'

const messages = {
    en: {
        message: {
            hello: 'hello world'
        }
    },
    cn: {
        message: {
            hello: '你好,世界'
        }
    }
}

// 使用选项创建i18n实例
const i18n = createI18n({
    locale: 'cn', // 当前语言
    fallbackLocale: 'en', // 回退语言
    messages,
    legacy: false,
    // 如果需要指定其他选项，可以设置其他选项
    // ...
})

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

在index.vue中使用：

# index.vue

效果：切换前\后

 

非常简单！欢迎学习和交流