# vue: <Plural>
URL: https://generaltranslation.com/es/docs/vue/reference/components/plural.mdx
---

title: "<Plural>"
description: Renderiza contenido según el conteo mediante las reglas de plural de la configuración regional activa. Referencia de la API del componente <Plural>.

---

El componente `<Plural>` selecciona una variante con nombre según un conteo numérico y las reglas de plural de la configuración regional activa. Colócalo dentro de [`<T>`](/docs/vue/reference/components/t) cuando deban traducirse sus variantes.

## Descripción general [#overview]

Pasa el conteo mediante `n` y define ranuras con nombres estáticos para las formas que necesite el texto de origen:

```vue
<Plural :n="count">
  <template #one>One item</template>
  <template #other>Several items</template>
  <template #default>No matching form</template>
</Plural>
```

Envuelve un conteo dinámico en [`<Num>`](/docs/vue/reference/components/num) cuando aparezca en el texto renderizado de una rama.

## Cómo funciona [#how-it-works]

* **Anulaciones numéricas.** Cuando se proporcionan, `zero` gestiona el valor absoluto `0`; `singular` y luego `one`, el `1`; y `dual` y luego `two`, el `2`. Estas anulaciones se aplican antes que las reglas de configuración regional.
* **Selección según la configuración regional.** De lo contrario, `Intl.PluralRules` determina la categoría CLDR de la configuración regional. `singular` y `dual` pueden actuar como alias de las categorías `one` y `two` de la configuración regional; después, `plural` y `other` proporcionan contenidos alternativos generales, en ese orden.
* **Contenido alternativo.** Si ninguna de las formas proporcionadas coincide, se renderiza la ranura predeterminada. El componente no añade ningún contenedor HTML.
* **Extracción estática.** Dentro de [`<T>`](/docs/vue/reference/components/t), el extractor registra todas las ramas con nombre compatibles, aunque el renderizado en tiempo de ejecución seleccione solo una.

Para un `<Plural>` independiente, la configuración regional predeterminada configurada ignora los `locales` explícitos y usa únicamente esa configuración. En otra configuración regional activa, un componente independiente prueba los `locales` explícitos, la configuración regional activa y la configuración regional predeterminada, en ese orden.

Dentro de [`<T>`](/docs/vue/reference/components/t), la traducción enriquecida controla la selección plural. El contenido alternativo de origen usa la configuración regional predeterminada; el contenido traducido prueba la configuración regional activa y luego la predeterminada. En ese caso, se ignora una prop `locales` explícita.

## Props y ranuras [#props]

| Nombre                     | Descripción                                                       | Tipo         | Opcional | Predeterminado                                |
| -------------------------- | ----------------------------------------------------------------- | ------------ | -------- | --------------------------------------------- |
| [`n`](#n)                  | Conteo usado para seleccionar una forma plural.                   | `number`     | No       | —                                             |
| [`locales`](#locales)      | Configuraciones regionales preferidas para seleccionar el plural. | `string[]`   | Sí       | Orden de resolución de configuración regional |
| [`default`](#default-slot) | Contenido que se renderiza cuando no coincide ninguna forma.      | `VNodeChild` | Sí       | Vacío                                         |
| [`[form]`](#form-slots)    | Contenido para una forma plural compatible.                       | `VNodeChild` | Sí       | —                                             |

### `n`

**Tipo** `number` · **Obligatorio**

El conteo que se utiliza para elegir una categoría plural. Muestra el conteo por separado con [`<Num>`](/docs/vue/reference/components/num); `n` solo determina la selección.

### `locales`

**Tipo** `string[]` · **Opcional** · **Predeterminado** Orden de resolución de configuraciones regionales

Códigos de configuración regional BCP 47 preferidos para reglas de plural independientes. Solo tienen prioridad cuando la configuración regional activa no es la predeterminada configurada. Dentro de [`<T>`](/docs/vue/reference/components/t), la prop se ignora.

### Ranura predeterminada

**Tipo** `VNodeChild` · **Opcional** · **Predeterminado** Vacío

Contenido que se renderiza cuando ninguna de las ranuras con nombre proporcionadas coincide con la forma seleccionada.

### Ranuras de forma

**Tipo** `VNodeChild` · **Opcional**

Los nombres admitidos son:

* Categorías de CLDR: `zero`, `one`, `two`, `few`, `many` y `other`
* Alias generales: `singular`, `dual` y `plural`

Agrega solo las categorías necesarias para las configuraciones regionales que admitas. Dado que las anulaciones numéricas se aplican primero, una ranura `one` proporcionada gestiona cualquier valor absoluto de `1` y una ranura `two` proporcionada gestiona cualquier valor absoluto de `2`, incluso si la categoría CLDR de la configuración regional es distinta. Los demás valores siguen la categoría de la configuración regional y el orden de contenido alternativo.

Dentro de [`<T>`](/docs/vue/reference/components/t), las ranuras de forma deben ser incondicionales, tener nombres estáticos y no tener ámbito. Una ranura con nombre tiene prioridad sobre un atributo primitivo estático con el mismo nombre. También se admiten atributos de cadena estáticos para alternativas sencillas:

```vue
<Plural :n="count" one="One item" other="Several items" />
```

## Ejemplos [#examples]

```vue title="InboxCount.vue"
<script setup lang="ts">
import { Num, Plural, T } from 'gt-vue';

defineProps<{ count: number }>();
</script>

<template>
  <T>
    <Plural :n="count">
      <template #one>You have <Num :value="count" /> message.</template>
      <template #other>You have <Num :value="count" /> messages.</template>
      <template #default>No messages.</template>
    </Plural>
  </T>
</template>
```

Para seleccionar según valores arbitrarios, usa [`<Branch>`](/docs/vue/reference/components/branch).