简介

在SPA中实现国际化，数据的来源一般有两种：

静态数据：写在js中，打包到前端文件里

动态数据： 通过后端接口返回

本工具适用于使用动态数据或者同时使用两者用的场景。该工具可以帮你整合数据，并作缓存。在需要国际化切换时，你只需要传入对应的语种。剩下的工作由工具帮你完成。

ps: 当存在缓存时，callback会可能先后执行两次，这是为了更好的用户体验：触发国际化切换直接使用缓存数据更新，此为第一次；第二次则是接口返回后，工具对比缓存发现不一样，再刷新一次。第二次刷新在callback传入isCache用于使用时区别

Install

npm install LocaleManager -S

Quick Start

const localeManager = new LocaleManager({
    // 选填: 静态国际化数据
    staticLocaleData: {
        en: {
            title: 'hello world'
        },
        zh: {
            title: '你好，世界'
        }
    },
    // 必填：一个返回结果为promise的函数。promise里返回的是从后端获取的国际化数据
    requestFn: () => {
        return axios.get('xxx').then((res) => {
            return res; // 返回国际化数据
        }
    }
})

/**
* 主函数
* lang: 语种
* callback 回调方法
**/
localeManager.start(lang, (res) => {
    // res是可以直接使用的国际化数据，结合自己对应的业务要求编写代码
    // 业务代码...
});

constructor

| 参数名 | 是否必填 | 说明 | 默认 | | :----: | :----: | :----: | :----: | | requestFn | 是 | 获取动态国际化数据的方法 | - | | staticLocaleData | 否 | 静态国际化数据 | {} | | expireTime | 否 | 前端缓存时间 | Infinity | | storageKey | 否 | 缓存locastorage对应的名字 | LocaleGetter |

例子

npm run example