uniapp项目多语言配置

• 安装 vue-i18n

npm install vue-i18n --save

• 配置main.js

1.
import VueI18n from 'vue-i18n'
import Zh from './common/lang/zh.js'
import En from './common/lang/en.js'

2.
Vue.use(VueI18n); 
const i18n = new VueI18n({
    locale: 'en',
    messages:{
        zh: Zh,
        hk: Hk,
        en: En
    }
});

3.
Vue.prototype._i18n = i18n;
4.
const app = new Vue({
    i18n,
    ...App
})

• 建立语言文件

en.js

export default {  
    login: {
        title: 'hello world',
        account: 'account',
       
    }
}

zh.js

export default { 
		login: {
			title : '你好，世界',
			account : '账号',
		
		}

}

 

• 使用方法

页面中
{{ $t('login.title') }}

js中
this.title = $t('login.title')

切换语言
this.$i18n.locale = "zh";//关键语句   en