UNI-APP_i18n国际化引入

官方文档：https://uniapp.dcloud.net.cn/tutorial/i18n.html

vue2中使用

1. 新建文件 locale/index.js

import en from './en.json'
import zhHans from './zh-Hans.json'
import zhHant from './zh-Hant.json'
const messages = {
	en,
	'zh-Hans': zhHans,
	'zh-Hant': zhHant
}

let i18nConfig = {
  locale: uni.getLocale(),
  messages
}

export default i18nConfig

新建文件 locale/en.json 等引入的json文件

{
	"index.i1": "测试"
}

2. main.js配置

import App from './App'

// #ifndef VUE3
import Vue from 'vue'
import i18nConfig from '@/locale/index.js'
import VueI18n from 'vue-i18n'
Vue.use(VueI18n)
const i18n = new VueI18n(i18nConfig)
import './uni.promisify.adaptor'
Vue.config.productionTip = false
App.mpType = 'app'
const app = new Vue({
	i18n,
  ...App
})
app.$mount()
// #endif

3. 使用

{{$t('index.i1')}}

在js中使用

import { initVueI18n } from '@dcloudio/uni-i18n'  
import messages from '@/locale/index' 
const { t } = initVueI18n(messages)  


t('config.request.i001')

4. 切换语言

• uni.setLocale() 用来切换系统或应用语言环境，调用此方法后会重启整个应用
• this.$i18n.locale 用来切换实际语言
• 注意：uni.setLocale()方法需要在this.$i18n.locale切换语言之后再调用，否则app端会有问题，语言切换不能实时显示

export default {
	data() {
		return {
			langList: [
				{name: 'English', locale: 'en'},
				{name: '简体中文', locale: 'cn'}
			]
		}
	},
	methods:{
		setLocale(index, item) {
			this.$i18n.locale = item.locale
			uni.setLocale(item.locale)
		},
	}
}

vue3使用

https://blog.youkuaiyun.com/weixin_45573681/article/details/128483984