Panoramica

getTranslations viene usato per ottenere le traduzioni delle stringhe dal dizionario delle traduzioni nei componenti lato server.

const d = await getTranslations(); // Ottiene la funzione di traduzione
d('greeting.hello'); // passa l'ID per ottenere una traduzione

getTranslations supporta:

• La traduzione di stringhe e contenuti JSX.
  • Inserimento di variabili e logica condizionale all'interno delle traduzioni.
  • Prefisso opzionale degli ID.

Per le traduzioni lato client, vedi useTranslations.

Riferimenti

Proprietà

Descrizione

Restituisce

Una Promise di una funzione di traduzione d che, dato un ID, restituirà la versione tradotta della relativa voce

Promise<(id: string, options?: DictionaryTranslationOptions) => React.ReactNode>

Esempi

Uso di base del dizionario

Ogni voce del tuo dizionario viene tradotta.

const dictionary = {
  greeting: <>Ciao, Alice!</>, 
};
export default dictionary;

Quando vogliamo accedere a queste voci (lato server), chiamiamo getTranslations. Questa restituisce una funzione che accetta la chiave di una traduzione dal dizionario.

import { getTranslations } from 'gt-next/server';

export default async function TranslateGreeting() {
  
  const d = await getTranslations(); 

  return (
    <p>
      {d('greeting')} // Ciao, Alice // [!code highlight]
    </p>
  );
}

Utilizzo delle variabili

Per passare dei valori, è necessario (1) assegnare un identificatore e (2) fare riferimento a tale identificatore quando si chiama la funzione d.

In questo esempio, usiamo {} per passare variabili alle traduzioni. Nel dizionario assegniamo l’identificatore {userName}.

const dictionary = {
  greeting: "Ciao, {userName}!", 
};
export default dictionary;

import { getTranslations } from 'gt-next/server';

export default async function TranslateGreeting() {
  const d = await getTranslations();
  
  // Ciao Alice!
  const greetingAlice = d('greeting', { userName: "Alice" }); 

  return (
    <p>
      {greetingAlice}
    </p>
  );
}

Utilizzo dei prefissi

Possiamo usare i prefissi per recuperare solo un sottoinsieme del dizionario.

const dictionary = {
  prefix1: { 
    prefix2: { 
      greeting: "Ciao, Bob",
    }
  }
};
export default dictionary;

Poiché abbiamo aggiunto il valore 'prefix1.prefix2' al metodo getTranslations, tutte le chiavi sono prefissate con prefix1.prefix2:

import { getTranslations } from 'gt-next/server';

export default function UserDetails() {
  const d = await getTranslations('prefix1.prefix2'); 
  return (
    <div>
      <p>{d('greeting')}</p> // greeting => prefix1.prefix2.greeting // [!code highlight]
    </div>
  );
}

Note

• La funzione getTranslations consente di accedere alle traduzioni del dizionario dal lato server.

Prossimi passaggi

• Consulta useTranslations per l’equivalente client-side di getTranslations.