i18n

120 阅读1分钟

安装 导入 main.js

import VueI18n from 'vue-i18n'
Vue.use(VueI18n)

// 创建实例
const i18n = new VueI18n({
    locale : 'zh',
    messages : {
        zh : {
            tab1 : '中文1',
            tab2 : '中文2'
        },
        en : {
            tab1 : 'tab1',
            tab2 : 'tab2'
        },
        jp : {
            tab1 : 'nihongo1',
            tab2 : 'nihongo2'
        }
    }
})

new Vue({
    i18m
})

使用

vue
{{$t('tab1')}}

js
$t('tab1')

切换

this.$i18n.locale = 'en' or this.$i18n.locale = 'zh'

封装

const message = {
    zh : {
        ...zhLocale,
        ...elementZhLocale // 组件库
    },
    en : {
        ...enLocale,
        ...elementEnLocale 
    }
}

const i18n = new VueI18n({
    locale : 'zh',
    message
})

export default i18n