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>

是这么用的,但是因为我本地没有这些翻译包,晕~~~~~并没有成功

花了点时间,自己做的语言包,验证已成功

上一篇下一篇

猜你喜欢

热点阅读