前端多语言(json文件)加载器
npm安装
-
npm install lang-i18n-loader --save
启动demo
-
npm run test
访问控制台输出的地址,开2个tab观察
使用示例
``
JavaScript
``
init字段说明
|属性名| 必填项 |类型|说明|
|:----- |:----- |:-----|----- |
|path | 否 |str | 语言包路径,默认是空 '' |
|version | 否 |str | 需要按照版本规则写,格式:1.1.12 |
|cacheKey | 否 |str | 如果需要缓存,必须填入一个唯一的key,一般是需求相关名 |
|urlLangKey | 否 |str | url中不一定限定lang字段指定,可以通过这个指定url中的字段。默认是lang |
|dataType | 否 |str | json,js,txt 默认是json |
|name | 是 |object/array | name字段可以填地区码,当字段和其值相同,可以写成数组形式。\['en', 'th', 'ko'] |
|callback | 是 |fn | data为返回的值 |
设置语言
1,multiLang.setLang(langname, fn)。第二个是可选的回调函数。可能同步也可能异步调起。之所以需要这个选项,是希望设置语言的那个tab加载完(有缓存则同步,无缓存则异步)语言包后(此时也做了缓存)再做操作localstorage的动作。以免操作过早,其他tab也立刻去加载语言包,无法利用缓存。
实例multiLang有一个有用的属性info
1,info.langSelectList是一个数组列表。根据你init传入的name字段,返回一个让用户设置的语言列表。第一个是当前正在使用的语言。
2, naviCodeString 浏览器语言码长串,对应短串naviCode,urlCode是url中指定语言码,hashCode是hash指定的语言码,hostCode本域设定语言码。
langCode是当前使用语言码。
注意:
1,某个tab设置了语言后,会触发全域下引入加载器的tab也“尝试加载你设置的语言”。注意,全域下可能不仅仅只有你这个需求。其他tab的加载在当前tab加载后(已设定缓存)再加载,此时你浏览器的network是查不到记录的,是从缓存中取得。
2,当某个tab刷新后,发现version升高了,会触发更新并缓存,然后也会触发全域下,同cacheKey的tab去加载。
3,目前限定了最多缓存列表长度为10个。
4,如果url或者hash中有参数指定了语言,指定的语言不是设置,它只是一种临时访问。对应的语言包会缓存,但不会导致其他未指定语言的tab更新,也不会影响“全域设置”。
5,js格式不缓存。
0.1.4
应土耳其地区运营要求,修改土耳其语言选项的翻译
改为Türkçe