# react-native: useMessages
URL: https://generaltranslation.com/it/docs/react-native/api/strings/use-messages.mdx
---
title: useMessages
description: Riferimento API per la funzione useMessages() per la traduzione delle stringhe
---

{/* GENERATO AUTOMATICAMENTE: non modificare direttamente. Modifica il modello in content/docs-templates/. */}


## Panoramica

La funzione `useMessages` è un hook per tradurre le stringhe codificate da `msg` nella fase di build.

```jsx
const m = useMessages();

<p>{m(encodedString)}</p>;
```

<Callout>
  **Traduzione in fase di build:** le traduzioni di `useMessages` avvengono in fase di build,
  prima che la tua app venga distribuita. Puoi passare stringhe codificate con `msg` e verranno
  tradotte nella lingua preferita dell&#39;utente.
</Callout>


## Riferimento

### Parametri

Nessuno

### Restituisce

Una funzione di callback, `m`, che traduce il contenuto codificato fornito da `msg`.

```jsx
(encodedContent: string, options?: Record<string, any>) => string
```

| Nome             | Tipo                  | Descrizione                                                          |
| ---------------- | --------------------- | -------------------------------------------------------------------- |
| `encodedContent` | `string`              | Il contenuto della stringa codificata da `msg` da tradurre.          |
| `options?`       | `Record<string, any>` | Parametri facoltativi per passare variabili alla stringa codificata. |

***


## Comportamento

### Produzione

Durante il processo di CD, qualsiasi contenuto all&#39;interno di una funzione `msg` viene tradotto prima del deployment dell&#39;applicazione.
Questo garantisce tempi di caricamento rapidi per tutte le impostazioni regionali, ma può tradurre solo i contenuti noti nella fase di build.

Una volta generate, le traduzioni vengono (1) memorizzate nella CDN oppure (2) incluse nell&#39;output di build della tua app, in base alla configurazione.
Da lì, il contenuto tradotto viene distribuito agli utenti.
Se una traduzione non viene trovata, viene usato il contenuto originale come fallback.

Assicurati di seguire la [guida al deployment qui](/docs/react-native/tutorials/quickdeploy).

### Sviluppo

Durante lo sviluppo, la funzione `m` tradurrà il contenuto on demand.
Questo è utile per fare prototipi di come apparirà la tua app in lingue diverse.
Ricorda di aggiungere una chiave API Dev al tuo ambiente per abilitare questo comportamento.

Noterai un ritardo durante la traduzione on demand in fase di sviluppo.
Questo non accadrà nelle build di produzione, a meno che il contenuto non venga tradotto esplicitamente on demand.

***

## Esempio

### Utilizzo di base

Puoi usare `useMessages` per tradurre le stringhe codificate con `msg`.

```jsx copy
import { msg, useMessages } from 'gt-react-native';

const encodedGreeting = msg('Hello, Alice!');

export default function TranslateGreeting() {
  const m = useMessages();

  return <p>{m(encodedGreeting)}</p>;
}
```

Nota: &quot;Alice&quot; verrà tradotto nella lingua preferita dell&#39;utente.


### Uso delle variabili [#variables]

Puoi passare variabili alle stringhe codificate.

```jsx copy
import { msg, useMessages } from 'gt-react-native';

const encodedGreeting = msg('Hello, {name}!');

export default function TranslateGreeting() {
  const m = useMessages();

  return (
    <p>
      {m(encodedGreeting, { name: 'Bob' })}{' '}
      {/* Questo visualizzerà "Hello, Bob!" */}
    </p>
  );
}
```


### Le variabili di `msg` sovrascrivono quelle di `m`

Quando passi variabili sia a `msg` sia a `m`, quelle passate a `msg` sovrascrivono quelle passate a `m`.

```jsx copy
import { msg, useMessages } from 'gt-react-native';

const encodedGreeting = msg('Hello, {name}!', { name: 'Alice' });

export default function TranslateGreeting() {
  const m = useMessages();
  return <p>{m(encodedGreeting, { name: 'Bob' })}</p>;
}
```

Nota: verrà visualizzato &quot;Ciao, Alice!&quot; - la variabile non viene sovrascritta in fase di rendering.


### Uso del formato messaggi ICU

`gt-react-native` supporta il formato messaggi ICU, che ti consente anche di formattare le variabili.

```jsx copy
import { msg, useMessages } from 'gt-react-native';

const encodedMessage = msg(
  'There are {count, plural, =0 {no items} =1 {one item} other {{count} items}} in the cart',
  { count: 10 }
);

export default function TranslateGreeting() {
  const m = useMessages();
  return <p>{m(encodedMessage)}</p>;
}
```

<Callout>
  Il formato dei messaggi ICU è un metodo efficace per formattare le variabili. Per maggiori
  informazioni, consulta la [documentazione del formato dei messaggi
  ICU](https://unicode-org.github.io/icu/userguide/format_parse/messages/).
</Callout>


### Importare da `gt-react-native`

Se usi la direttiva `"use client"`, devi importare da `gt-react-native` invece di `gt-react-native`.

```jsx copy
'use client';
import { msg, useMessages } from 'gt-react-native';

const encodedGreeting = msg('Hello, Alice!');

export default function TranslateGreeting() {
  const m = useMessages();

  return <p>{m(encodedGreeting)}</p>;
}
```

***


## Note

* La funzione `useMessages` è un hook che traduce le stringhe codificate da `msg`.
* La traduzione delle stringhe con `useMessages` avviene prima del runtime, durante il processo di build (tranne che in fase di sviluppo).

## Passaggi successivi

* Consulta [`msg`](/docs/react-native/api/strings/msg) per codificare le stringhe da tradurre.