标签:end text button lod 天天向上 str 实例 enter merge
1、引入 vue-i18n
import Vue from ‘vue‘ import VueI18n from ‘vue-i18n‘ import merge from ‘lodash/merge‘
2.准备本地的文言信息
const messages = { zh: { message: { hello: ‘好好学习,天天向上!‘ } }, en: { message: { hello: ‘good good study, day day up!‘ } } }
3、创建带有选项的 VueI18n 实例
const i18n = new VueI18n({ locale: ‘zh‘, messages, }) export default i18n
4、把 i18n 挂载到 vue 根实例上
import i18n from ‘@i18n‘ new Vue({ router, store, i18n, render: h => h(App), }).$mount(‘#app‘)
<div id="app">
<p>{{ foo }}</p>
<!-- 这里的 `foo` 不会更新! -->
<button v-on:click="foo = ‘baz‘">Change it</button>
</div>
5、在模板中使用
<div id="app"> <h1 style="font-size: 16px; text-align: center;">{{ $t("message.hello") }}</h1> </div>
标签:end text button lod 天天向上 str 实例 enter merge
原文地址:https://www.cnblogs.com/vickylinj/p/9537717.html