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>

详细查看 官网

VueI18n - 多语言国际化支持插件的更多相关文章

  1. Spring Boot + Freemarker多语言国际化的实现

    最近在写一些Web的东西,技术上采用了Spring Boot + Bootstrap + jQuery + Freemarker.过程中查了大量的资料,也感受到了前端技术的分裂,每种东西都有N种实现, ...

  2. VUE实现Studio管理后台(三):支持多语言国际化(vue-i18n)

    RXEditor的第一版本是英文版,有些朋友看起来觉得不习惯,后来因为惰性,不愿意再修改旧代码加入中文版,这次提前就把这个问题解决了,克服惰性最好的方式,就是想到就尽快去做,避免拖延. 本来计划在界面 ...

  3. GJM :用JIRA管理你的项目(二)JIRA语言包支持及插件支持 [转载]

    感谢您的阅读.喜欢的.有用的就请大哥大嫂们高抬贵手"推荐一下"吧!你的精神支持是博主强大的写作动力以及转载收藏动力.欢迎转载! 版权声明:本文原创发表于 [请点击连接前往] ,未经 ...

  4. 自定义JSP标签实现语言国际化(类似struts text标签),并同时支持图片、JS文件国际化

    源代码及样例下载地址: http://download.csdn.net/detail/u014569459/7169385 一.功能说明: 1. 支持语言国际化 2. 支持图片文件.JS文件国际化 ...

  5. 使用 PySide2 开发 Maya 插件系列三:qt语言国际化(internationalization)

    使用 PySide2 开发 Maya 插件系列三:qt语言国际化(internationalization) 前言: 这是 qt for python 的语言国际化,基于 UI 的,python 也有 ...

  6. 用JIRA管理你的项目——(二)JIRA语言包支持及插件支持

    昨天兴奋地把JIRA环境搭好,瞅了一眼管理界面--全英文,真是汗! 尚且不说全中文版管理界面让人操作起来多少会有困难,更别说是全英文! 昨天赞叹JIRA语言包支持丰富,今天终于找到了号称100%的语言 ...

  7. jquery/vue/react前端多语言国际化翻译方案指南

    ❝ 本文章共3470字,预计阅读时间5-10分钟. ❞ 国际化-前言 每个开发者能希望编写的程序可以让全世界的用户使用,它要求从产品中抽离所有地域语言,国家/地区和文化相关的元素.换种说法,「应用程序 ...

  8. 【Android Studio安装部署系列】二十九、Android Studio安装本地插件(以国际化方法插件AndroidLocalizationer为例)

    版权声明:本文为HaiyuKing原创文章,转载请注明出处! 概述 实际开发中,需要用到插件,用来提高效率,这里就以生成国际化strings.xml的插件AndroidLocalizationer为例 ...

  9. 使用JSP的fmt标签实现国际化支持 - smart-framework ; smart-plugin-i18n

    使用JSP的fmt标签实现国际化支持   Smart-framework框架使用smart-plugin-i18n插件来完成国际化处理,原理相同,使用过滤器进行参数设置. ============== ...

随机推荐

  1. Rust入坑指南:坑主驾到

    欢迎大家和我一起入坑Rust,以后我就是坑主,我主要负责在前面挖坑,各位可以在上面看,有手痒的也可以和我一起挖.这个坑到底有多深?我也不知道,我是抱着有多深就挖多深的心态来的,下面我先跳了,各位请随意 ...

  2. Linux入门(历史与现状)

    Linux 入门之 历史与现状   Linux是一个计算机的操作系统,与windows类似,是一款系统软件.操作系统首先是一个计算机程序,使用计算机语言开发,比如C语言.VC语言.是计算机硬件和应用软 ...

  3. 02-25 scikit-learn库之决策树

    目录 scikit-learn库之决策树 一.DecisionTreeClassifier 1.1 使用场景 1.2 代码 1.3 参数详解 1.4 属性 1.5 方法 二.DecisionTreeR ...

  4. 【网络安全】CSRF攻击详解

    目录 什么是CSRF攻击 CSRF攻击的流程 常见的CSRF攻击类型 CSRF漏洞测试 预防CSRF攻击 参考 什么是CSRF攻击 CSRF(Cross-Site Request Forgery)的全 ...

  5. Z-buffer算法

    1.Z缓冲区(Z-Buffer)算法 1973年,犹他大学学生艾德·卡姆尔(Edwin Catmull)独 立开发出了能跟踪屏幕上每个像素深度的算法 Z-buffer Z-buffer让计算机生成复杂 ...

  6. unittest中HTMLTestRunner模块生成

    unittest里面是不能生成html格式报告的,需要导入一个第三方的模块:HTMLTestRunner 一.导入HTMLTestRunner 方法1.这个模块下载不能通过pip安装了,只能下载后手动 ...

  7. EF通过导航属性取出从表的集合后,无法删除子表

    主从表是配了级联删除的,如果通过导航属性去除从表明细删除时将报错The relationship could not be changed because one or more of the for ...

  8. 【前端词典】4 个实用有趣的 JS 特性

    前言 最近在学习的过程中发现了我之前未曾了解过的一些特性,发现有些很有趣并且在处理一些问题的时候可以给我一个新的思路. 这里我将这些特性介绍给大家. 4 个有趣的 JS 特性 利用 a 标签解析 UR ...

  9. veil-Evasion免杀使用

    Veil-Evasion 是 Veil-Framework 框架的一部分,也是其主要的项目.利用它我们可以生成绕过杀软的 payload   kali 上并未安装,下面我们来进行简单的安装.我们直接从 ...

  10. jquery的返回顶端的功能实现

    页面很长的时候,读到最下面,需要返回顶端,则在页面最下面布局一个返回顶部的图标很有用. 具体功能是,jquey控制,向下滚动出现返回顶部图片,若滚动返回顶部或点回顶部,则图标消失. 实现效果如下图: