VueI18n - 多语言国际化支持插件

VueI18n介绍

vue-i18n是一个vue组件,主要功能是提供国际化多语言的支持。例如项目中打印收费单功能,需要支持中英文打印,使用该组件就很容易的实现,而不必写两份打印单页面。

使用方法

  1. 安装 npm install --save vue-i18n
  2. 在vue中引入该组件
import Vue from 'vue';
import VueI18n from 'vue-i18n';

Vue.use(VueI18n);
  1. 创建vue-i18n实例
import Vue from 'vue';
import VueI18n from 'vue-i18n';

Vue.use(VueI18n);

const messages = {
  en: {
    message: {
      hello: 'hello world'
    }
  },
  ja: {
    message: {
      hello: 'こんにちは、世界'
    }
  }
}

// Create VueI18n instance with options
const i18n = new VueI18n({
  locale: 'ja', // set locale
  messages, // set locale messages
})
  1. 创建vue实例时,将i18n对象以参数方式传过去
new Vue({ i18n }).$mount('#app')
  1. 页面上使用i18n中的资源
<div id="app">
  <p>{{ $t("message.hello") }}</p>
</div>

输出:

<div id="#app">
  <p>こんにちは、世界</p>
</div>

详细查看 官网

posted @ 2019-11-12 16:58  Jingge  阅读(932)  评论(0编辑  收藏  举报