Demo

useLazyLocaleTranslation

Authenticated ERP page များအတွက် ဦးစားပေး i18n hook ဖြစ်ပါသည်။ setting.locale အရ JSON ကို on-demand load လုပ်ပါသည်။

ဘယ်အခါ သုံးမလဲ

  • setting.locale ဖတ်နိုင်သော authenticated pages
  • အသစ်လုပ်ငန်းတွင် sync useLocaleTranslation ထက် ဤ hook ကို ဦးစားပေးပါ
  • Public / pre-login ဆို usePublicLazyLocaleTranslation သုံးပါ

Signature

LazyLocaleType map ပေးပါ။ translation helpers နှင့် isLoading ရရှိပါသည်။

TSsignature
1function useLazyLocaleTranslation( 2 locales: LazyLocaleType, 3): { 4 translation: { 5 get: (key: string, fallback?: string, data?: Record<string, unknown>) => string; 6 }; 7 isLoading: boolean; 8 // … 9};

အသုံးပြုပုံ

locales/*.json နှင့် LazyLocaleType map ထားရှိပြီး string တိုင်းကို translation.get() ဖြတ်ပါ။

TSXbranch.locale.ts
1import type { LazyLocaleType } from "@quan-erp/shared-ui"; 2 3export const BranchLocaleLazy: LazyLocaleType = { 4 "en-US": () => import("./locales/en-US.json"), 5 "my-MM": () => import("./locales/my-MM.json"), 6 "zh-CN": () => import("./locales/zh-CN.json"), 7};
TSXbranch.page.tsx
1import { useLazyLocaleTranslation } from "@quan-erp/shared-ui"; 2import { BranchLocaleLazy } from "./branch.locale"; 3 4export function BranchPage() { 5 const { translation, isLoading } = useLazyLocaleTranslation( 6 BranchLocaleLazy, 7 ); 8 9 if (isLoading) return null; 10 11 return ( 12 <h1>{translation.get("branches", "Branches")}</h1> 13 ); 14}

မှတ်ချက်များ

  • လိုအပ်လျှင် translation.isLoading ကို ကိုင်တွယ်ပါ
  • defaultValue ကို အမြဲ ပေးပါ