# gt-react: General Translation React SDK: Plural
URL: https://generaltranslation.com/it/docs/react/api/components/plural.mdx
---
title: Plural
description: Riferimento API del componente Plural
---

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


## Panoramica

Usiamo il componente `<Plural>` per gestire la concordanza delle frasi.
Considera la differenza tra queste frasi: &quot;Hai un elemento.&quot; e &quot;Hai due elementi.&quot;

In inglese, devi definire due frasi diverse in base al numero di elementi.
In altre lingue, potresti doverne definire fino a sei.

```jsx
const count = 1;
<Plural n={count}
  one={You have one item.}
  other={You have some items.}
/>
```


## Riferimento

### Proprietà

<TypeTable
  type={{
  "n": {
    description: 'Il numero usato per determinare la forma del plurale.',
    type: 'number',
    optional: false,
  },
  "children?": {
    description: 'Valore di fallback se nessuna forma plurale corrisponde',
    type: 'any',
    optional: true,
    default: 'undefined',
  },
  "locales?": {
    type: 'string[]',
    optional: true,
    default: 'undefined',
  },
  "[key]: string": {
    type: 'string | JSX.Element',
    optional: false,
  },
}}
/>

La sintassi `[key]: string` indica chiavi arbitrarie che rappresentano possibili rami di pluralizzazione.
Ad esempio, rami come `singular` e `plural` possono essere aggiunte come parametri.

### Descrizione

| Nome della prop | Descrizione                                                                                                                                                                                                                                                                                                                                                                                       |
| --------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `n`             | Il numero usato per determinare la forma plurale. È obbligatorio per la pluralizzazione.                                                                                                                                                                                                                                                                                                          |
| `children`      | Contenuto di fallback da visualizzare se non viene trovato alcun ramo plurale corrispondente.                                                                                                                                                                                                                                                                                                     |
| `locales`       | Impostazioni regionali facoltative per specificare l&#39;impostazione regionale di formattazione. Se non vengono fornite, viene usata l&#39;impostazione regionale predefinita dell&#39;utente. Per ulteriori informazioni su come specificare le impostazioni regionali, consulta [qui](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl#locales_argument). |
| `[key]: string` | Rami che rappresentano le forme plurali. I rami disponibili dipendono dall&#39;impostazione regionale.                                                                                                                                                                                                                                                                                            |

### Restituisce

`JSX.Element` che contiene il contenuto corrispondente alla forma plurale di `n`, oppure il contenuto di fallback.

### Genera

`Error` se `n` non è specificato o non è un numero valido.

***

## Quali forme devo aggiungere?

Devi usare solo le forme del plurale previste nella tua lingua.

Le forme possibili sono: `"singular"`, `"plural"`, `"dual"`, `"zero"`, `"one"`, `"two"`, `"few"`, `"many"`, `"other"`.

* Se sei uno sviluppatore che usa `"en-US"`, usane solo due: `"singular"` e `"plural"`.
* Se sei uno sviluppatore che usa `"zh-CN"`, usa solo `"other"`.

Leggi di più sulle diverse forme [qui](https://cldr.unicode.org/index/cldr-spec/plural-rules).

***

## Esempi

### Utilizzo di base

Usa il componente `<Plural>` per gestire la pluralizzazione.

```jsx title="BasicExample.jsx" copy
import { Plural } from 'gt-react';

export default function ItemCount({ count }) {
  return (
    <Plural n={count} // [!code highlight]
      one={You have one item.}
      other={You have some items.}
    />
  );
}
```


### Fallback

Puoi specificare un fallback se il valore passato a `n` non corrisponde ad alcun ramo.

```jsx title="FallbackExample.jsx" copy
import { Plural } from 'gt-react';

export default function ItemCount({ count }) {
  return (
    <Plural n={count}
      one={Hai un elemento.}
    >
      Hai alcuni elementi. // [!code highlight]
    </Plural>
  );
}
```


### Traduzione dei plurali

Per tradurre, devi solo aggiungere il componente `<T>`.

```jsx title="PluralExample.jsx" copy
import { T, Plural } from 'gt-react';

export default function ItemCount({ count }) {
  return (
  <T id="itemCount">
    <Plural n={count}
      one={You have an item.} // [!code highlight]
      other={You have some items.} // [!code highlight]
    />
  );
}
```


### Aggiungere variabili

E se volessimo aggiungere delle variabili alla frase pluralizzata?

```jsx title="PluralExample.jsx" copy
import { T, Plural, Num } from 'gt-react';

export default function ItemCount({ count }) {
  return (
    <Plural n={count}
      one={You have <Num>{count}</Num> item.} // [!code highlight]
      other={You have <Num>{count}</Num> items.} // [!code highlight]
    />
  );
}
```

Quando ti trovi all&#39;interno di un componente `<T>`, racchiudi tutti i contenuti dinamici in `<Currency>`, `<DateTime>`, `<Num>` o `<Var>`.

```jsx
<T id="itemCount">
  <Plural n={count}
    one={You have <Num>{count}</Num> item.} // [!code highlight]
    other={You have <Num>{count}</Num> items.} // [!code highlight]
  />
</T>
```

***


## Note

* Il componente `<Plural>` viene utilizzato per gestire la pluralizzazione.
* Le categorie plurali disponibili (ad esempio one, other, few, many) dipendono dall&#39;impostazione regionale e seguono le [regole di pluralizzazione Unicode CLDR](https://cldr.unicode.org/index/cldr-spec/plural-rules).

## Passaggi successivi

* Per altri esempi, consulta la documentazione di riferimento su [Come usare i componenti di branching](/docs/react/guides/branches).
* Per un utilizzo più avanzato, combina `<Plural>` con componenti variabili come `<Currency>`, `<DateTime>`, `<Num>` e `<Var>`. Per saperne di più, consulta [Come usare i componenti variabili](/docs/react/guides/variables).