多语工具包multilanguage(java版)

multilanguage的maven项目托管在https://github.com/xionghuiCoder/multilanguage,同时也可以在http://www.oschina.net/p/multilanguage上了解它的简单介绍。

1、多语系统介绍

多语系统用于向不同的用户展示不同的语言,比如大陆用户习惯使用简体,港台用户习惯繁体,美国用户习惯英语;用户可以根据自己的喜好自由切换语言。

下面来看看提供多语功能的产品

oracle的mysql下载页(https://edelivery.oracle.com/):

205623_AknF_1990220.jpg

205623_Tmmd_1990220.png

携程(http://www.ctrip.com/):

205735_5hCX_1990220.jpg

205736_szFw_1990220.jpg

205736_Q4hR_1990220.jpg

阿里的注册页面(http://reg.taobao.com/member/reg/fill_mobile.htm):

210124_InmV_1990220.png

210124_CcGC_1990220.png

百度的招聘页面(http://talent.baidu.com/baidu/web/index/CompbaiduPageindex):

210155_ZO6Q_1990220.jpg

210156_l7Qx_1990220.jpg

然而这些都是通过开发多个页面来支持多语功能的,这种方案存在一些问题:维护性差(有几种语言就得维护几套页面),扩展性差(新支持一种语言又得开发一套新页面)。

2、多语系统demo

我们可以用多语系统代替以上方案,可以参考multilanguage-web-demo项目(https://github.com/xionghuiCoder/multilanguage-web-demo),启动该web项目(直接运行该项目下的JettyStart.java即可),然后访问http://127.0.0.1:8080/即可体验多语功能:

211416_gyCz_1990220.png

211417_4dBf_1990220.png

211417_vyFQ_1990220.png

该多语demo使用ajax动态获取多语资源,并用DOM操作切换多语值;所以只用维护一个页面,扩展新语言时只用配置新的资源文件即可;既提高了维护性又提高了扩展性。

3、多语系统接口demo

当多语系统变得复杂,需要提高性能、提供容错机制时,可以参考multilanguage-interface-demo项目https://github.com/xionghuiCoder/multilanguage-interface-demo

该demo提供六种接口:

1、http://127.0.0.1:8080/multilanguage/all_tips?relative_path=language&langtype=english&folder_name=01&file_name=test_annotation.properties:

{
    0001: "test/1 annotation",
    0002: "test",
    0003: "test",
    0004: "test//4 annotation",
    0005: "test///5 annotation",
    0006: "test//",
    0007: "test//",
    0008: "test8 annotation",
    0009: "test/9 annotation",
    0010: "test"
}

2、http://127.0.0.1:8080/multilanguage/tip?relative_path=language&langtype=english&folder_name=01&file_name=test.properties&langcode=0001 :

"test"

3、http://127.0.0.1:8080/multilanguage/tips?relative_path=language&langtype=english&folder_name=01&file_name=test.properties&langcodes=0001|0002 :

{
    0001: "test",
    0002: "begin{0}{1}{2}{3}"
}

4、http://127.0.0.1:8080/multilanguage/params_tip?relative_path=language&langtype=english&folder_name=01&file_name=test.properties&langcode=0002&params=a|b :

"beginab{2}{3}"

5、http://127.0.0.1:8080/multilanguage/params_tips?relative_path=language&langtype=english&folder_name=01&file_name=test.properties&langcodes=0002|0003&params=a|b :

{
    0002: "beginab{2}{3}",
    0003: "ab{2}{3}end"
}

6、http://127.0.0.1:8080/multilanguage/paramses_tips?relative_path=language&langtype=english&folder_name=01&file_name=test.properties&langcodes=0002|0003&paramses=a|b,c|d :

{
    0002: "beginab{2}{3}",
    0003: "cd{2}{3}end"
}

基于multilanguage-interface-demo可以开发分布式或者集群的多语系统。

4、multilanguage

multilanguage是一个多语开发工具包;multilanguage-web-demo和multilanguage-interface-demo都是基于multilanguage开发的。multilanguage主要用于管理多语资源的存,它使用软引用和弱引用缓存多语值,并针对资源的访问次数维持一个最大堆和最小堆,当内存不足时会释放访问次数很少的一部分资源;这样既保证了性能也能防止内存泄露。

转载于:https://my.oschina.net/xionghui/blog/397098

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Vue.js是一个流行的JavaScript框架,可以轻松地创建动态的Web应用程序。它被广泛用于构建单页应用程序。在现代Web应用程序中,多语言功能是不可或缺的。多语言功能可以帮助您的网站吸引更多的国际用户,因为它可以让您的网站在不同的语言中呈现。 在Vue.js中,有许多多语言插件可供选择。其中一些最流行的包括vue-i18n、vuex-i18n和vue-multilanguage。在这篇文章中,我们将介绍这些插件的基本用法和如何在Vue.js应用程序中使用它们。 1. vue-i18n vue-i18n是Vue.js中最流行的多语言插件之一。它提供了易于使用的API,可以在应用程序中轻松添加多语言支持。它支持复数形式、日期格式和时间格式等常见的多语言特性。 首先,您需要通过npm安装vue-i18n插件。在终端中输入以下命令: ``` npm install vue-i18n ``` 然后,在您的Vue.js应用程序中添加以下代码: ``` import Vue from 'vue' import VueI18n from 'vue-i18n' Vue.use(VueI18n) const messages = { en: { message: { hello: 'Hello world!' } }, fr: { message: { hello: 'Bonjour le monde!' } } } const i18n = new VueI18n({ locale: 'en', // set locale messages, // set locale messages }) new Vue({ i18n, render: h => h(App) }).$mount('#app') ``` 接下来,您可以在Vue.js组件中使用以下代码来访问多语言翻译: ``` <template> <div>{{ $t("message.hello") }}</div> </template> ``` 这将返回“Hello world!”或“Bonjour le monde!”,具体取决于当前的语言设置。 2. vuex-i18n vuex-i18n是基于Vue.js和Vuex的多语言插件。它提供了一个易于使用的API,可以在应用程序中轻松添加多语言支持。它支持复数形式、日期格式和时间格式等常见的多语言特性。 首先,您需要通过npm安装vuex-i18n插件。在终端中输入以下命令: ``` npm install vuex-i18n ``` 然后,在您的Vue.js应用程序中添加以下代码: ``` import Vue from 'vue' import Vuex from 'vuex' import vuexI18n from 'vuex-i18n' Vue.use(Vuex) const store = new Vuex.Store() Vue.use(vuexI18n.plugin, store) const translationsEn = { hello: 'Hello world!' } const translationsFr = { hello: 'Bonjour le monde!' } Vue.i18n.add('en', translationsEn) Vue.i18n.add('fr', translationsFr) Vue.i18n.set('en') new Vue({ store, render: h => h(App) }).$mount('#app') ``` 接下来,您可以在Vue.js组件中使用以下代码来访问多语言翻译: ``` <template> <div>{{ $t("hello") }}</div> </template> ``` 这将返回“Hello world!”或“Bonjour le monde!”,具体取决于当前的语言设置。 3. vue-multilanguage vue-multilanguage是一个轻量级的多语言插件,它提供了易于使用的API,可以在应用程序中轻松添加多语言支持。它支持复数形式、日期格式和时间格式等常见的多语言特性。 首先,您需要通过npm安装vue-multilanguage插件。在终端中输入以下命令: ``` npm install vue-multilanguage ``` 然后,在您的Vue.js应用程序中添加以下代码: ``` import Vue from 'vue' import Multilanguage from 'vue-multilanguage' Vue.use(Multilanguage, { default: 'en', en: { hello: 'Hello world!' }, fr: { hello: 'Bonjour le monde!' } }) new Vue({ render: h => h(App) }).$mount('#app') ``` 接下来,您可以在Vue.js组件中使用以下代码来访问多语言翻译: ``` <template> <div>{{ $ml.hello }}</div> </template> ``` 这将返回“Hello world!”或“Bonjour le monde!”,具体取决于当前的语言设置。 以上是三种Vue.js多语言插件的基本用法和示例。根据您的应用程序需要和个人喜好,您可以选择其中任何一种多语言插件来实现多语言功能。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值