# gt-next: General Translation Next.js SDK: Plural
URL: https://generaltranslation.com/es/docs/next/api/components/plural.mdx
---
title: Plural
description: Referencia de la API para el componente Plural
---

{/* GENERADO AUTOMÁTICAMENTE: No edites esto directamente. En su lugar, edita la plantilla en content/docs-templates/. */}


## resumen

Usamos el componente `<Plural>` para gestionar la concordancia en las oraciones.
Piensa en la diferencia entre las oraciones: &quot;You have one item.&quot; y &quot;Tienes dos elementos.&quot;

En inglés, tienes que definir dos oraciones diferentes según la cantidad de elementos.
En otros idiomas, puede que tengas que definir hasta seis.

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


## Referencia

### Props

<TypeTable
  type={{
  "n": {
    description: 'El número que se usa para determinar la forma plural.',
    type: 'number',
    optional: false,
  },
  "children?": {
    description: 'Alternativa cuando no coincide ninguna forma plural',
    type: 'any',
    optional: true,
    default: 'undefined',
  },
  "locales?": {
    type: 'string[]',
    optional: true,
    default: 'undefined',
  },
  "[key]: string": {
    type: 'string | JSX.Element',
    optional: false,
  },
}}
/>

La sintaxis `[key]: string` indica claves arbitrarias que representan posibles ramas de pluralización.
Por ejemplo, se pueden añadir ramas como `singular` y `plural` como parámetros.

### Descripción

| Prop Name       | Descripción                                                                                                                                                                                                                                                                                                           |
| --------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `n`             | El número que se usa para determinar la forma plural. Es obligatorio para la pluralización.                                                                                                                                                                                                                           |
| `children`      | Contenido alternativo que se renderiza si no se encuentra ninguna rama plural coincidente.                                                                                                                                                                                                                            |
| `locales`       | locales opcionales para especificar la configuración regional de formato. Si no se proporcionan, se usa la configuración regional predeterminada del usuario. leer sobre cómo especificar locales [aquí](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl#locales_argument). |
| `[key]: string` | Ramas que representan formas plurales. Las ramas exactas dependen de la configuración regional.                                                                                                                                                                                                                       |

### Devuelve

`JSX.Element` que contiene el contenido correspondiente a la forma plural de `n` o el contenido alternativo.

### Lanza

`Error` si no se proporciona `n` o si no es un número válido.

***

## ¿Qué formas debo agregar?

Solo necesitas usar las formas de plural de tu idioma.

Las formas posibles son: `"singular"`, `"plural"`, `"dual"`, `"zero"`, `"one"`, `"two"`, `"few"`, `"many"`, `"other"`.

* Si eres desarrollador y usas `"en-US"`, usa solo dos: `"singular"` y `"plural"`.
* Si eres desarrollador en `"zh-CN"`, usa solo `"other"`.

leer sobre las formas diferentes [aquí](https://cldr.unicode.org/index/cldr-spec/plural-rules).

***

## Ejemplos

### Uso básico

Usa el componente `<Plural>` para manejar la pluralización.

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

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


### Alternativas

Puedes proporcionar una alternativa en caso de que el valor pasado a `n` no tenga ramas que coincidan.

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

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


### Traducción de plurales

Para traducir, solo tienes que añadir el componente `<T>`.

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

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]
    />
  );
}
```


### Agregar variables

¿Qué pasa si queremos agregar algunas variables a la frase pluralizada?

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

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]
    />
  );
}
```

Dentro de un componente `<T>`, envuelve todo el contenido dinámico con `<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>
```

***


## Notas

* El componente `<Plural>` se usa para manejar la pluralización.
* Las ramas de plural disponibles (p. ej., one, other, few, many) dependen de la configuración regional y siguen las [reglas de pluralización del Unicode CLDR](https://cldr.unicode.org/index/cldr-spec/plural-rules).

## Próximos pasos

* Para ver más ejemplos, consulta la documentación de referencia sobre [Uso de componentes de bifurcación](/docs/next/guides/branches).
* Para un uso más avanzado, combina `<Plural>` con componentes de variable como `<Currency>`, `<DateTime>`, `<Num>` y `<Var>`. leer [Uso de componentes de variable](/docs/next/guides/variables).