使用i18n對vue專案進行國際化

2021-10-06 03:47:16 字數 1006 閱讀 2325

一、安裝元件

npm install vue-i18n
二、在src/lang資料夾下新建cn.js和en.js

1、cn.js

export const m =
2、en.js

export const m =
三、在src/i18n資料夾下新建index.js檔案。沒有直接將這部分寫入main.js中是因為在其他的js檔案中可能會用到i18n,方便引入。

import vue from 'vue'

import vuei18n from 'vue-i18n'

vue.use(vuei18n)

const i18n = new vuei18n(

})export default i18n

四、在main.js中引入i18n

import vue from 'vue'

import router from './router'

import i18n from './i18n'

vue.config.productiontip = false

/* eslint-disable no-new */

new vue()

五、在 .vue檔案中使用示例

1、在標籤中使用,例

}
2、在js**中使用,例

let h = this.$t('m.hello')
3、當this.$i18n.locale='zh-cn'時,1和2中的值是 '你好';當this.$i18n.locale='en-us'時,1和2中的值是 'hello'。

六、在其他js檔案中引入i18n,直接import

import i18n from '@/i18n'

Facelets如何進行i18n

如果使用jsp作為jsf的檢視,那麼在每個也沒可以用載入國際化檔案,但是使用faclets如何進行國際化檔案載入呢?我的做法如下 1.在faces config.xml中增加如下配置 zh cn message 2.在 web inf classes 下增加message.properties和me...

Vue多語言切換 i18n使用

vue使用中經常設計到多語言切換。官方文件比較通俗,1小時看完就會上手,我簡單記錄下自己在使用犯蠢的錯誤。1.tc 用於複數,例如英文一般分單複數 這裡的複數,指的是同乙個字段,可能根據單複數不同可以有多個值對關係 const messages banana bananas 2.t 使用在一般場景,...

react Taro 使用i18n國際化

npm install react i18next i18next i18next browser languagedetector 新建index.jsx import languagedetector from i18next browser languagedetector import i1...