# react-native: деривация
URL: https://generaltranslation.com/ru/docs/react-native/api/strings/derive.mdx
---
title: деривация
description: Справка по API для строковой функции derive()
---

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


## Обзор

Функция `derive` позволяет использовать в строках перевода статические вызовы функций и выражения с переменными.
Это полезно для написания переиспользуемого кода, интернационализации фрагментированных предложений и сохранения грамматического согласования.

```jsx
const getDisplayName = (condition) => {
  return condition ? "User" : 'Admin';
};

gt(`${derive(getDisplayName(condition))} says hello.`);
// Создаёт две записи перевода:
// "User says hello." -> "Usuario dice hola."
// "Admin says hello." -> "Administrador dice hola."
```

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

<Callout>
  **Несколько записей перевода:**
  `derive` создает отдельные записи перевода для каждого возможного результата обернутой функции, что может значительно увеличить количество переводов.
  Используйте эту возможность с осторожностью и отдавайте предпочтение ICU-выражениям `select`, если число вариантов становится слишком большим.
</Callout>

<Callout>
  **Статический анализ:**
  `derive` может анализировать только то, что известно на этапе сборки.
  Любой динамический контент (переменные, вызовы API и т. д.) должен быть обернут в `declareVar`.
</Callout>

## Справка

### Параметры

| Имя       | Тип                                                          | Описание                                                        |
| --------- | ------------------------------------------------------------ | --------------------------------------------------------------- |
| `content` | `T extends string \| boolean \| number \| null \| undefined` | Статический вызов функции, возвращающий переводимое содержимое. |

### Возвращаемое значение

Возвращает `content` типа `T`.

***

## Поведение

### Анализ на этапе сборки

Во время сборки CLI:

1. Анализирует функцию, обёрнутую в деривацию `derive`
2. Определяет все возможные возвращаемые значения функции (они должны быть доступны для статического анализа на этапе сборки)
3. Создаёт отдельные записи перевода для каждого уникального результата

### Влияние на производительность

Как и `<Derive>`, `derive` увеличивает количество записей перевода.
Каждый вызов функции с несколькими возможными результатами создает отдельные переводы, а несколько вызовов `derive` в одной строке экспоненциально увеличивают общее количество записей.

***

## Пример

### Повторно используемый контент

Вы можете использовать `derive` для обработки фрагментированных предложений или при повторном использовании контента с вызовами функций.

```jsx copy
import { derive, gt } from 'gt-react-native';

function getSubject() {
  return "boy";
}

function Component() {
  const translation1 = gt(`The ${derive(getSubject())} is playing.`);
  const translation2 = gt(`The ${derive(getSubject())} is having fun.`);
  const translation3 = gt(`The ${derive(getSubject())} is having a great time.`);
  return <p>{translation1} {translation2} {translation3}</p>;
}
```


### Фрагментированные предложения

Вы можете использовать `derive` для работы с фрагментированными предложениями в вызовах функций.

```jsx copy
import { derive, gt } from 'gt-react-native';

function getSubject(gender) {
  return gender === 'male' ? 'boy' : 'girl';
}

function Component({ gender }) {
  const translation = gt(`The ${derive(getSubject(gender))} is playing.`);
  return <p>{translation}</p>;
}
```


### Согласование

Без `деривации` перевод согласования становится синтаксически громоздким.
Вам нужно добавить конструкцию `select`, чтобы обработать согласование (число, род и т. д.).
Затем также нужно перечислить все возможные варианты.

```jsx copy
import { gt } from 'gt-react-native';

function getSubject(gender) {
  return gender === 'male' ? 'boy' : 'girl';
}

function Component({ gender }) {
  const translation = gt(
    '{gender, select, boy {The boy is playing.} girl {The girl is playing.} other {}}',
    {
      gender: getSubject(gender) ,
    },
  );
  return <p>{translation}</p>;
}
```

С `derive` согласование становится простым.
Не нужен ни оператор `select`, ни явное перечисление всех вариантов.

```jsx copy
import { derive, declareVar, gt } from 'gt-react-native';

function getSubject(gender) {
  return gender === 'male' ? 'boy' : 'girl';
}

function Component({ gender }) {
  const translation = gt(`The ${derive(getSubject(gender))} is playing.`);
  return <p>{translation}</p>;
}
```

При использовании `derive` CLI определяет, что у `getSubject` есть два возможных результата, и создает отдельную запись перевода для каждого из них.
Благодаря этому согласование происходит автоматически.

* &quot;Мальчик играет&quot; -&gt; &quot;*El* niño está jugando&quot;
* &quot;Девочка играет&quot; -&gt; &quot;*La* niña está jugando&quot;


### С переменными

Вы можете комбинировать `derive` с `declareVar` для динамических данных.

```jsx copy
import { derive, declareVar, gt } from 'gt-react-native';

function getGreeting(name) {
  return name ? `Hello, ${declareVar(name)}` : 'Hello, stranger';
}

function Component({ name }) {
  const translation = gt(`${derive(getGreeting(name))}! How are you?`);
  return <p>{translation}</p>;
}
```


### Сложные функции

Функции могут содержать несколько условных ветвлений и операторов `return`.

```jsx copy
import { derive, gt } from 'gt-react-native';

function getStatusMessage(status, priority) {
  if (status === 'complete') {
    return priority === 'high' ? 'Urgent task completed' : 'Task completed';
  } else if (status === 'pending') {
    return priority === 'high' ? 'Urgent task pending' : 'Task pending';
  }
  return 'Task status unknown';
}

function Component({ status, priority }) {
  const message = gt(`${derive(getStatusMessage(status, priority))}.`);
  return <p>{message}</p>;
}
```


### Встроенные выражения и логика

Вы можете встраивать логику прямо в вызов `derive`.

```jsx copy
import { derive, gt } from 'gt-react-native';

function Component({ gender }) {
  const message = gt(`The ${derive(gender === 'male' ? 'boy' : 'girl')} is playing.`);
  return <p>{message}</p>;
}
```

***


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

* Используйте `derive` с осторожностью, так как он может экспоненциально увеличить количество записей перевода
* Все возможные результаты должны поддаваться статическому анализу на этапе сборки
* Переменные внутри статических функций должны быть обёрнуты в `declareVar`

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

* См. [`declareVar`](/docs/react-native/api/strings/declare-var), чтобы помечать динамический контент внутри статических функций
* См. [`decodeVars`](/docs/react-native/api/strings/decode-vars), чтобы извлекать исходные значения из объявленных переменных
* См. [`<Derive>`](/docs/react-native/api/components/derive) — эквивалент в JSX
* Подробнее см. в [примечаниях к выпуску](/devlog/gt-next_v6_12_0)