vue-i18n中英文切换

1 、npm install vue-i18n
2、在 main.js 中引入 vue-i18n (前提是要先引入 vue)
3 、建两个个文件 用了存翻译文字
import zheng from ‘@/assets/zheng.js’//中文文件
import English from ‘@/assets/English.js’//英文文件
import VueI18n from ‘vue-i18n’
Vue.use(VueI18n)
const i18n = new VueI18n({
locale: localStorage.getItem(‘locale’)?localStorage.getItem(‘locale’):‘zh’, // 语言标识
messages: {
‘zh’: zheng,
‘en’: English
}
})
new Vue({
el: ‘#app’,
router,
i18n,
components: { App },
template: ‘’
})
export default English
4、在页面中引用

{{$t("message.title")}}

注释:
中英文文件如下
zheng.js
const zheng = {
message: {
title: ‘运动品牌’
},
}
export default zheng

English.js
const zheng = {
message: {
title: ‘运动品牌’
},
}
export default English

猜你喜欢

转载自blog.csdn.net/smlljet/article/details/89714127
今日推荐