1.安裝vue-i18n
2.main.js中引入? import?i18n?from?'./i18n/i18n'
3.掛載到vue實(shí)例下
4.項(xiàng)目文件夾下如下配置
zh-CN.js文件：
import?zhLocale?from?'element-ui/lib/locale/lang/zh-CN'?//?引入element語(yǔ)言包
import?store?from?'../../store'
const?cn?=?{
??message:?{
????'placeholderAddress':?'請(qǐng)選擇住址',
????'demoShow':?store.getters.config.projectName,
????'name':?'姓名',
????'school':?'學(xué)校',
????'adress':?'住址',
????'placeholderDate':?'請(qǐng)選擇日期',
????'placeholderTime':?'請(qǐng)選擇時(shí)間',
????'profile':?'個(gè)人簡(jiǎn)介',
????'text':?'好好學(xué)習(xí)，天天向上'
??},
??...zhLocale
}
export?default?cn
en.js文件：
import?enLocale?from?'element-ui/lib/locale/lang/en'?//?引入element語(yǔ)言包
const?en?=?{
??message:?{
????'placeholderAddress':?'Please?Choose?Adress',
????'demoShow':?'demoShow',
????'name':?'name',
????'school':?'school',
????'adress':?'adress',
????'placeholderDate':?'Please?Choose?Date',
????'placeholderTime':?'Please?Choose?Time',
????'profile':?'profile',
????'text':?'Good?good?study,?Day?day?up'
??},
??...enLocale
}
export?default?en
index.js文件
import?en?from?'./en'
import?cn?from?'./zh-CN'
export?default?{
??en:?en,
??cn:?cn
}
i18n.js文件：
import?Vue?from?'vue'
import?locale?from?'element-ui/lib/locale'
import?VueI18n?from?'vue-i18n'
import?messages?from?'./langs'
Vue.use(VueI18n)
//?從localStorage獲取語(yǔ)言選擇。
const?i18n?=?new?VueI18n({
??locale:?localStorage.lang?||?'en',?//?初始未選擇默認(rèn)?cn?中文
??messages
})
locale.i18n((key,?value)?=>?i18n.t(key,?value))?//?兼容element
export?default?i18n
需要切換的文字$t('message.school')，直接獲取key映射value
