vue-i18n
2018-05-17 本文已影响0人
有一个程序媛
刚开始也是看到别人写的代码中有这个,当时直接copy过来,但是很坑
1.我忘了我并没有安装vue-i18n,那我们先来安装一下吧
npm install vue-i18n
2.你的项目中的main.js中也要引入
import VueI18n from 'vue-i18n'
Vue.use(VueI18n)
3.本地应该都有一个中英文翻译的包,如果你是俄语,OK,欢迎你来把所有中文翻译成俄语
const messages = {
zh: {
message: {
hello: '我才18岁,好吧?'
}
},
en: {
message: {
hello: 'I am 18 years old,ok?'
}
}
}
4.创建带有选项的 VueI18n 实例
const i18n =new VueI18n({
locale: 'en',// 语言标识
messages
})
5.把 i18n 挂载到 vue 根实例上
const app =new Vue({
router,
i18n,
...App
}).$mount('#app')
6.在 HTML 模板中使用
<div id = "app">
<h1>{{$t("message.hello")}}</h1>
</div>
是这么用的,但是因为我本地没有这些翻译包,晕~~~~~并没有成功
花了点时间,自己做的语言包,验证已成功