# gt-next: General Translation Next.js SDK: derive
URL: https://generaltranslation.com/zh/docs/next/api/strings/derive.mdx
---
title: derive
description: derive() 字符串函数的 API 参考文档
---

{/* 自动生成：请勿直接编辑。请改为编辑 content/docs-templates/ 中的 template。 */}


## 概述

`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` | 用于返回可翻译内容的静态函数调用。 |

### 返回

返回类型为 `T` 的 `content`。

***

## 行为

### 构建时分析

在构建过程中，CLI 工具会：

1. 分析由 `derive` 包裹的函数
2. 确定该函数所有可能的返回值 (这些返回值必须能在构建时静态分析出来)
3. 为每个唯一的返回结果创建单独的翻译条目

### 性能注意事项

与 `<Derive>` 类似，`derive` 也会增加翻译条目的数量。
每次函数调用如果可能产生多个结果，都会创建单独的翻译；而同一字符串中多次调用 `derive`，会使总条目数呈指数级增长。

***

## 示例

### 可复用内容

你可以使用 `derive` 来处理句子碎片化，或用于通过函数调用复用内容。

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

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-next';

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` 时，处理一致性的翻译在语法上会很繁琐。
你需要添加一个 select 语句来处理一致性 (如复数、性别等) 。
然后，还必须枚举每一种可能的结果。

```jsx copy
import { gt } from 'gt-next';

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-next';

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;The boy is playing&quot; -&gt; &quot;*El* niño está jugando&quot;
* &quot;The girl is playing&quot; -&gt; &quot;*La* niña está jugando&quot;


### 配合变量使用

你可以将 `derive` 与 `declareVar` 结合使用，以支持动态内容。

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

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-next';

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-next';

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

***


## 注意事项

* 请谨慎使用 `derive`，因为它可能会使翻译条目呈指数级增长
* 所有可能的结果都必须能在构建时被静态分析
* 静态函数中的变量应使用 `declareVar` 包装

## 后续步骤

* 如需在静态函数中标记动态内容，请参阅 [`declareVar`](/docs/next/api/strings/declare-var)
* 如需从已声明的变量中提取原始值，请参阅 [`decodeVars`](/docs/next/api/strings/decode-vars)
* 关于对应的 JSX 形式，请参阅 [`<Derive>`](/docs/next/api/components/derive)
* 更多信息请参阅[发布说明](/devlog/gt-next_v6_12_0)