# gt-next: General Translation Next.js SDK: Currency
URL: https://generaltranslation.com/ru/docs/next/api/components/currency.mdx
---
title: Currency
description: Справка по API компонента Currency
---

{/* СГЕНЕРИРОВАНО АВТОМАТИЧЕСКИ: Не редактируйте напрямую. Вместо этого измените шаблон в content/docs-templates/. */}


## Обзор

Компонент `<Currency>` отображает числовое значение как денежную сумму.
Число форматируется в соответствии с текущей локалью и переданными необязательными параметрами.
Компонент `<Currency>` отвечает только за форматирование и не выполняет никаких расчётов по обменному курсу.

```jsx
<Currency>{100}</Currency>
// Вывод: $100.00
```

Все преобразования формата выполняются локально с помощью библиотеки [`Intl.NumberFormat`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat).


## Справочник

### Свойства

<TypeTable
  type={{
  "children?": {
      type: 'any',
      optional: true,
      default: 'undefined',
  },
  "name?": {
      type: 'string',
      optional: true,
      default: 'undefined',
  },
  "value?": {
      description: 'Необязательное значение. Если оно не указано, в качестве значения используется children.',
      type: 'string | number',
      optional: true,
      default: 'undefined',
  },
  "currency?": {
      type: 'string',
      optional: true,
      default: '"USD"',
  },
  "options?": {
      type: 'Intl.NumberFormatOptions',
      optional: true,
      default: '{}',
  },
  "locales?": {
      type: 'string[]',
      optional: true,
      default: 'undefined',
  },
}}
/>

### Описание

| Свойство   | Описание                                                                                                                                                                                                                                                                                                                             |
| ---------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| `children` | Содержимое, отображаемое внутри компонента. Обычно это число — значение, которое нужно отформатировать как валюту. Если передано, имеет приоритет над пропом `value`.                                                                                                                                                                |
| `name`     | Необязательное имя поля валюты, используемое в метаданных.                                                                                                                                                                                                                                                                           |
| `value`    | Значение валюты по умолчанию. Если не указано, используется `children`. Может быть строкой или числом. Перед форматированием строки преобразуются в числа.                                                                                                                                                                           |
| `currency` | Тип валюты, например `"USD"` или `"EUR"`. Определяет символ и форматирование, используемые для этой валюты.                                                                                                                                                                                                                          |
| `options`  | Необязательные параметры форматирования валюты в соответствии со [спецификацией `Intl.NumberFormatOptions`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat). Используйте их, чтобы задать такие параметры, как максимальное количество знаков после запятой, группировка и т. д. |
| `locales`  | Необязательные локали, задающие локаль форматирования. Если не указаны, используется локаль пользователя по умолчанию. Подробнее о том, как указывать локали, читайте [здесь](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl#locales_argument).                                               |

### Возвращает

`JSX.Element`, содержащий строку с суммой, отформатированной как валюта.

***

## Примеры

### Базовый пример

Компонент `<Currency>` можно использовать для отображения денежных значений в локальном формате.

```jsx title="PriceDisplay.jsx" copy
import { Currency } from 'gt-next'; // [!code highlight]

export default function PriceDisplay(item) {
    return (
        <Currency> {item.price} </Currency> // [!code highlight]
    );
}
```


### Указание валюты

Здесь цена отображается в евро.

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

export default function PriceDisplay(item) {
  return (
    <Currency currency="EUR"> {item.price} </Currency> // [!code highlight]
  );
}
```


### Перевод компонентов Currency

Предположим, вы хотите, чтобы валюта отображалась в предложении, которое тоже переводится.
Для этого можно обернуть компонент `<Currency>` в компонент `<T>`.

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

export default function PriceDisplay(item) {
  return (
    <T id="itemPrice"> // [!code highlight]
      The price is <Currency> {item.price} </Currency>.
    </T> // [!code highlight]
  );
}
```


### Настраиваемое форматирование

Здесь мы отображаем цену в GBP, явно задавая количество знаков после запятой и используя узкий символ валюты (то есть &quot;$100&quot; вместо &quot;US$100&quot;).
Подробнее о других параметрах см. в [Intl.NumberFormatOptions](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat).

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

export default function PriceDisplay(item) {
  return (
    <Currency
      currency="GBP"
      options={{ // [!code highlight]
        currencyDisplay: 'narrowSymbol', // [!code highlight]
        minimumFractionDigits: 2, // [!code highlight]
        maximumFractionDigits: 2, // [!code highlight]
      }} // [!code highlight]
    >
      {item.price}
    </Currency>
  );
}
```

***


## Примечания

* Компонент `<Currency>` используется для форматирования денежных значений в соответствии с текущей локалью и всеми переданными необязательными параметрами.
* Компонент `<Currency>` отвечает только за форматирование и не выполняет никаких вычислений обменного курса.
* Содержимое компонента `<Currency>` не отправляется в API для перевода.
  Всё форматирование выполняется локально с помощью библиотеки [`Intl.NumberFormat`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat).

## Следующие шаги

* Подробнее о компоненте `<Currency>` и других переменных компонентах, таких как `<Num>`, `<DateTime>` и `<Var>`, а также примеры их использования см. в документации [Использование переменных компонентов](/docs/next/guides/variables).