# vue: <Plural>
URL: https://generaltranslation.com/ru/docs/vue/reference/components/plural.mdx
---
title: "<Plural>"
description: Отображение содержимого в зависимости от count с учетом правил множественного числа активной локали. Справочник API компонента <Plural>.

---

Компонент `<Plural>` выбирает именованный слот на основе числового значения count и правил множественного числа активной локали. Поместите его внутрь [`<T>`](/docs/vue/reference/components/t), если его варианты нужно перевести.

## Обзор [#overview]

Передайте значение count через `n` и определите статически именованные слоты для форм, необходимых исходному тексту:

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

Оберните динамическое значение count в [`<Num>`](/docs/vue/reference/components/num), если оно отображается в тексте ветви.

## Как это работает [#how-it-works]

* **Числовые переопределения.** Если они указаны, `zero` обрабатывает абсолютное значение `0`; `singular`, затем `one` — значение `1`; а `dual`, затем `two` — значение `2`. Эти переопределения применяются до правил локали.
* **Выбор на основе локали.** В противном случае `Intl.PluralRules` определяет категорию CLDR для локали. `singular` и `dual` могут выступать алиасами категорий локали `one` и `two`, а `plural` и `other` служат общими резервными вариантами в указанном порядке.
* **Резервный вариант.** Если ни одна из указанных форм не подходит, отображается слот по умолчанию. Компонент не добавляет HTML-обёртку.
* **Статическое извлечение.** Внутри [`<T>`](/docs/vue/reference/components/t) экстрактор регистрирует каждую поддерживаемую именованную ветку, хотя при рендеринге выбирается только одна.

Для автономного `<Plural>` настроенная локаль по умолчанию игнорирует явно указанные `locales` и используется сама по себе. При любой другой активной локали автономный компонент последовательно пробует явные `locales`, активную локаль и локаль по умолчанию.

Внутри [`<T>`](/docs/vue/reference/components/t) выбором формы множественного числа управляет расширенный перевод. Для резервного исходного контента используется локаль по умолчанию; для переведённого контента сначала используется активная локаль, затем локаль по умолчанию. Явно заданное свойство `locales` в этом случае игнорируется.

## Пропсы и слоты [#props]

| Имя                        | Описание                                                       | Тип          | Необязательный | По умолчанию               |
| -------------------------- | -------------------------------------------------------------- | ------------ | -------------- | -------------------------- |
| [`n`](#n)                  | Число для выбора формы множественного числа.                   | `number`     | Нет            | —                          |
| [`locales`](#locales)      | Предпочтительные локали для выбора формы множественного числа. | `string[]`   | Да             | Порядок разрешения локалей |
| [`default`](#default-slot) | Контент, отображаемый, если ни одна форма не подходит.         | `VNodeChild` | Да             | Пусто                      |
| [`[form]`](#form-slots)    | Контент для одной из поддерживаемых форм множественного числа. | `VNodeChild` | Да             | —                          |

### `n`

**Тип** `number` · **Обязательно**

Количество, используемое для выбора формы множественного числа. Отображайте количество отдельно с помощью [`<Num>`](/docs/vue/reference/components/num); `n` влияет только на выбор формы.

### `locales`

**Тип** `string[]` · **Необязательно** · **По умолчанию** Порядок разрешения локалей

Предпочтительные коды локалей в формате BCP 47 для автономных правил множественного числа. Они имеют приоритет, только если активная локаль отличается от настроенной локали по умолчанию. Внутри [`<T>`](/docs/vue/reference/components/t) это свойство игнорируется.

### Слот по умолчанию

**Тип** `VNodeChild` · **Необязательный** · **По умолчанию** Пусто

Содержимое, отображаемое, если ни один переданный именованный слот не соответствует выбранной форме.

### Слоты форм

**Тип** `VNodeChild` · **Необязательно**

Поддерживаются следующие имена:

* Категории CLDR: `zero`, `one`, `two`, `few`, `many` и `other`
* Общие алиасы: `singular`, `dual` и `plural`

Добавляйте только категории, необходимые для поддерживаемых локалей. Поскольку числовые переопределения применяются первыми, указанный слот `one` обрабатывает любое абсолютное значение `1`, а слот `two` — любое абсолютное значение `2`, даже если категория CLDR для этой локали отличается. Для остальных значений используются категория локали и порядок резервного выбора.

Внутри [`<T>`](/docs/vue/reference/components/t) слоты форм должны быть безусловными, со статически заданными именами и без области видимости. Именованный слот имеет приоритет над статическим примитивным атрибутом с тем же именем. Для простых альтернатив также поддерживаются статические строковые атрибуты:

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

## Примеры [#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>
```

Для выбора по произвольным значениям используйте [`<Branch>`](/docs/vue/reference/components/branch).