# General Translation React SDKs (gt-react, gt-next): Plural
URL: https://generaltranslation.com/ru/docs/react/reference/components/plural.mdx
---

title: Plural
description: Отображайте контент, зависящий от количества, с использованием правил множественного числа активной локали в General Translation gt-react. Справочник API для Plural.

---

Компонент `<Plural>` изменяет форму предложения в зависимости от количества, используя правила множественного числа активной локали. Он выбирает правильную форму для числа — в английском нужны две (&quot;one item&quot; / &quot;two items&quot;), тогда как в других языках может потребоваться до шести.

*Доступно в `gt-react`, `gt-next`, `gt-tanstack-start` и `gt-react-native`. В примерах используется импорт из `gt-react`; вместо этого импортируйте из пакета вашего фреймворка.*

## Обзор [#overview]

Передайте количество в `n` и укажите дочерний элемент для каждой формы множественного числа.

```tsx
<Plural
  n={count}
  one={<>You have one item.</>}
  other={<>You have some items.</>}
/>
```

*Примечание: поместите `<Plural>` внутрь [`<T>`](/docs/react/reference/components/t), чтобы перевести варианты, и оберните динамические значения внутри них в компонент переменной, например [`<Num>`](/docs/react/reference/components/num).*

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

* **Выбор по локали.** Значение `n` сопоставляется с категорией множественного числа по [правилам множественного числа Unicode CLDR](https://cldr.unicode.org/index/cldr-spec/plural-rules) для активной локали. Затем отображается ветка для этой категории.
* **Резервный вариант.** Если подходящей ветки нет, `children` отображается как резервный вариант.
* **Резервный вариант без числа.** Если `n` отсутствует или не является корректным числом, `<Plural>` отображает `children` как резервный вариант, а не вызывает ошибку.

## Какие формы добавлять [#forms]

Вам нужны только те формы множественного числа, которые используются в вашем языке. Возможные формы: `zero`, `one`, `two`, `few`, `many`, `other`, а также алиасы `singular`, `dual` и `plural`.

* Для `en-US` используйте `one` и `other` (или `singular` и `plural`).
* Для `zh-CN` нужна только `other`.

См. [правила множественного числа в CLDR](https://cldr.unicode.org/index/cldr-spec/plural-rules) для каждого языка.

## Пропсы [#props]

| Проп                    | Описание                                                | Тип         | Необязательный | По умолчанию    |
| ----------------------- | ------------------------------------------------------- | ----------- | -------------- | --------------- |
| [`n`](#n)               | Число, определяющее форму множественного числа.         | `number`    | Нет            | —               |
| [`children`](#children) | Резервное содержимое, если не подошла ни одна ветка.    | `ReactNode` | Да             | —               |
| [`locales`](#locales)   | Переопределение локали для правил множественного числа. | `string[]`  | Да             | Активная локаль |
| [`[form]`](#form)       | Содержимое для категории множественного числа.          | `ReactNode` | Да             | —               |

### `n` [#n]

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

Число, используемое для определения формы множественного числа. Если оно отсутствует или не является корректным числом, `<Plural>` отображает `children` как резервный вариант вместо того, чтобы вызывать ошибку.

### `children` [#children]

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

Резервное содержимое, которое отображается, если `n` не соответствует ни одной форме множественного числа.

### `locales` [#locales]

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

Локали, для которых используются правила множественного числа. Если значение не указано, используется активная локаль.

### `[form]` [#form]

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

Проп для каждой категории множественного числа — `zero`, `one`, `two`, `few`, `many`, `other` (или алиасы `singular`, `dual` и `plural`). Доступные категории зависят от локали.

## Примеры [#examples]

```tsx title="BasicExample.tsx"
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.</>}
    />
  );
}
```

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

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

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

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

## Заметки [#notes]

* `<Plural>` обрабатывает формы множественного числа в соответствии с активной локалью.
* Доступные варианты зависят от локали и следуют [правилам множественного числа Unicode CLDR](https://cldr.unicode.org/index/cldr-spec/plural-rules).
* См. [`<Branch>`](/docs/react/reference/components/branch), если нужно ветвление на основе произвольных значений.