vue2国际化配置

main.js

import i18n from './i18n/index'
let vue = new Vue({
    i18n,
    ...
}).$mount('#app')
window.vue = vue

src/i18n/lang/network/zh.js

export default {
    ComplaintPrediction: {
        Time: '时间',
        ...
    },

    QualityManagement: {
        ruleClassification: '规则分类',
        ...
    }
}

src/i18n/lang/zh.js

import zhLocale from 'element-ui/lib/locale/lang/zh-CN' //引入element语言包

import network from './network/zh'

export default {
    ...network,
}

src/i18n/index.js

import Vue from 'vue'
import VueI18n from 'vue-i18n'
import zh from '@/i18n/lang/zh'
import en from '@/i18n/lang/en'
import Cookies from 'js-cookie'
Vue.use(VueI18n);


let language = localStorage.getItem('i18nLanguage')
console.log("language ===> ", language);
if (language === undefined || language === null) {
    // 读取浏览器语言
    language = navigator.language || navigator.userLanguage || navigator.browserLanguage || navigator.systemLanguage
}
Vue.prototype.$language = language

language = language.toLowerCase()
if (language.substr(0, 2) === 'zh') { // 中文
    language = 'zh'
} else { // 默认英文
    language = 'en'
}
console.log("language : " + language);

export default new VueI18n({
    locale: language, // 语言标识
    messages: {
        zh,
        en
    }
});

使用

<a-form-item :label="$t('ComplaintPrediction.Time')">
</a-form-item>
<a-button >{{ $t('ComplaintPrediction.Select') }}</a-button>

<script>
    {
        title: this.$t('ComplaintPrediction.BusyHourFailures'),
            children: [
                {
                    title: this.$t('ComplaintPrediction.Last1Month'),
                    dataIndex: 'BUSY_TOO_LONG_OCCURS_1',
                    key: 'BUSY_TOO_LONG_OCCURS_1',
                    width: 80,
                    align: 'center',
                },
                {
                    title: this.$t('ComplaintPrediction.Last6Months'),
                    dataIndex: 'BUSY_TOO_LONG_OCCURS',
                    key: 'BUSY_TOO_LONG_OCCURS',
                    width: 80,
                    align: 'center',
                },
            ],
    },
</script>