Skip to main content

国际化

例子#

基本用法#

以下是国际化的基本例子,演示了切换按钮上的中英文文案:

i18n basic

我们用的是 LangSetDefaultString 去设置具体用到的语言翻译数据, 然后用 LangSetCurrent 去设置当前语言。

i18n-switch
export interface ILang extends ILangBase {    // ave built-in language key    AppTitle: string;
    // user defined key    SwitchLang: string;}
export function onInitI18n(app: App) {    const i18n: Ii18n<ILang> = {        t(key, toReplace: object = {}) {            let result = app.LangGetString(key);            Object.keys(toReplace).forEach((each) => {                result = result.replace(`{{${each}}}`, toReplace[each]);            });            return result;        },        switch(this: Ii18n, id) {            app.LangSetDefaultString(id, this.lang[id]);            app.LangSetCurrent(id);        },        lang: {            [CultureId.en_us]: {                // ave built-in language key                __FontStd: "Segoe UI",                AppTitle: 'My App',
                // user defined key                SwitchLang: 'Switch Lang',            },            [CultureId.zh_cn]: {                __FontStd: "Microsoft YaHei UI",                AppTitle: '我的应用',
                SwitchLang: '切换语言'            },        },    };
    const context = getAppContext();    context.setI18n(i18n);}

国际化的支持是内置的,就是说,只要你创建 UI 组件的时候,传了相应参数(对应文案的 key),当你切换语言的时候,UI 组件上的文案是自动改变的。

import { onInitI18n } from "./i18n-switch";
function onInit(app: App) {    onInitI18n(app);    const context = getAppContext();    const i18n = context.getI18n();    i18n.switch(CultureId.en_us);}
export function App() {    const [currentLang, setCurrentLang] = useState<CultureId>(CultureId.en_us);
    const onSwitchLang: IButtonComponentProps["onClick"] = () => {        const context = getAppContext();        const i18n = context.getI18n();        if (currentLang === CultureId.en_us) {            setCurrentLang(CultureId.zh_cn);            i18n.switch(CultureId.zh_cn);        } else if (currentLang === CultureId.zh_cn) {            setCurrentLang(CultureId.en_us);            i18n.switch(CultureId.en_us);        }    };
    return (        <Window onInit={onInit}>            <DemoLayout>                <Button langKey="SwitchLang" onClick={onSwitchLang}></Button>            </DemoLayout>        </Window>    );}

API#

export interface IApp {    LangSetDefaultString(cid: CultureId, v: any): App;    LangSetCurrent(n: CultureId): App;}
export enum CultureId {    Default /**/ = -1,    en_us /**/ = 0,    ...    zh_cn /**/ = 562,    ...}