# react-native: Var
URL: https://generaltranslation.com/ru/docs/react-native/api/components/var.mdx
---
title: Var
description: Справочник API для компонента Var
---

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


## Обзор

Компонент `<Var>` используется для вывода содержимого, которое не следует переводить.
Это полезно при выводе переменных, фрагментов кода и другого содержимого, которое не следует переводить.
Кроме того, он полезен для вывода содержимого, которое должно оставаться конфиденциальным, например API-ключей или личной информации.

```jsx
<Var>{user.name}</Var>
```

Компонент `<Var>` всегда используется внутри компонента `<T>`.
Считайте его универсальным компонентом для динамических значений, которые не подходят под категории `<Currency>`, `<DateTime>` или `<Num>`.


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

### Пропсы

<TypeTable
  type={{
      "children?": {
          type: 'JSX.Element',
          optional: true,
          default: 'undefined',
      },
      "name?": {
          type: 'string',
          optional: true,
          default: 'undefined',
      },
      "value?": {
          type: 'string',
          optional: true,
          default: 'undefined',
      },
  }}
/>

### Описание

| Prop       | Описание                                                                                                    |
| ---------- | ----------------------------------------------------------------------------------------------------------- |
| `children` | Содержимое, отображаемое внутри компонента. Если передано, имеет приоритет над `value`.                     |
| `value`    | Необязательное значение по умолчанию, которое отображается, если `children` не передан. Может быть строкой. |

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

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

***

## Примеры

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

Компонент `<Var>` нужно использовать внутри компонента `<T>`.

```jsx title="Address.jsx" copy
import { T, Var } from 'gt-react-native'

export default function Example(user) {
  return (
    <T>
      Translate this text!
      Your name is: <Var>{user.name}</Var> // [!code highlight]
      <Var><p>Do not translate this text</p></Var> // [!code highlight]
    </T>
  );
}
```

***


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

* Переменные компоненты необходимы, чтобы сохранять в переводах динамическое содержимое, которое не следует переводить.
* Всегда используйте переменные компоненты внутри компонента `<T>`.
* Такие компоненты, как `<Num>`, `<Currency>` и `<DateTime>`, обеспечивают локализацию для точного форматирования.

## Дальнейшие шаги

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