loadTranslations
Riferimento all’API per la funzione loadTranslations().
Panoramica
La funzione loadTranslations è il principale metodo per personalizzare il comportamento di caricamento delle traduzioni.
In produzione, le traduzioni devono essere memorizzate in modo che possano essere renderizzate nella tua app.
Per impostazione predefinita, le traduzioni vengono memorizzate nel CDN di GT.
Puoi definire una funzione loadTranslations per ottenere le traduzioni da un’altra origine, ad esempio:
- Dal bundle della tua app (il più comune)
- Da un database
- Da un’API
- Da un altro CDN
Supportiamo nativamente il caricamento delle traduzioni da file locali inclusi nel bundle della tua app. Segui questa guida per configurare le traduzioni locali nella tua app React.
Riferimenti
Parametri
Prop
Type
Descrizione
| Tipo | Descrizione |
|---|---|
locale | La lingua/area per cui devono essere caricate le traduzioni. |
Restituisce
Una Promise<any> che risolve in una stringa o in un oggetto JSX contenente le traduzioni per la lingua/locale specificata.
Configurazione
Devi importare la funzione loadTranslations e passarla come prop al componente <GTProvider>.
import loadTranslations from './loadTranslations';
createRoot(document.getElementById("root")!).render(
<StrictMode>
<GTProvider locales={['es', 'fr']} loadTranslations={loadTranslations}> // [!code highlight]
<App />
</GTProvider>
</StrictMode>
);Esempi
Carica le traduzioni da file locali
Quando è configurato per usare le traduzioni locali, il comando gtx-cli translate salva le traduzioni nella cartella ./src/_gt.
export default async function loadTranslations(locale) {
const translations = await import(`./_gt/${locale}.json`);
return translations.default;
};Carica le traduzioni dal tuo CDN
export default async function loadTranslations(locale) {
try {
const translations = await fetch(`https://your-cdn.com/translations/${locale}.json`);
const data = await translations.json();
return data;
} catch (e) {
console.error(e);
return {};
}
};Note
loadTranslationsti consente di personalizzare le modalità di caricamento delle traduzioni nella tua app in produzione.- Il caso d’uso più comune è aggiungere traduzioni locali
Prossimi passaggi
Come valuti questa guida?