uniapp国际化vue2篇

2024-03-22  本文已影响0人  Allen6879

国际化语言包配置

1.根目录创建locale文件夹,结构如下

image.png

2.index.js代码

import en from './en.json'
import zhHans from './zh-Hans.json'
import zhHant from './zh-Hant.json'

export default {
     en,
    'zh-Hans': zhHans,
    'zh-Hant': zhHant
}

3.语言包代码如下


image.png

3.main.js引入国际化


image.png
image.png
image.png

使用语言包

1.在标签里面使用如下

<text class="style">{{ $t('my.lang') }}</text>

2.在js使用

this.$t('key')

3.在pages.json使用

image.png

4.在外部js使用

import messages from "@/locale/index.js"
let locale =  uni.getLocale() //获取当前语言
const lang = messages[locale]
 accounts.message =  lang['key'];

5.在NVUE 使用,computed 结合外部js使用

import messages from "@/locale/index.js"
  computed: {
    lang(){
        let lang =  uni.getLocale() //获取当前语言
        return  messages[lang]
    }
  }

  <text class="text">{{ lang['key'] }}</text>
上一篇下一篇

猜你喜欢

热点阅读