# General Translation React SDKs (gt-react, gt-next, gt-react-native): declareVar
URL: https://generaltranslation.com/zh/docs/react/reference/functions/declare-var.mdx
Docs index: https://generaltranslation.com/llms.txt
Description: 在派生内容中标记不可翻译的变量。declareVar 的 API 参考。

`declareVar` 函数用于在 [`derive`](/docs/react/reference/functions/derive) 内容中标记不应被翻译的动态内容，并在 运行时 作为变量处理。它是 [`<Var>`](/docs/react/reference/components/var) 组件对应的字符串形式。

*可用于 `gt-react`、`gt-next`、`gt-tanstack-start` 和 `gt-react-native`。*

## 概览 [#overview]

将动态值包装在一个由 [`derive`](/docs/react/reference/functions/derive) 分析的函数中。`declareVar` 会把它包装成与 ICU 兼容的占位符，并在运行时解析回原始值。

```tsx
function getGreeting(name) {
  return 'Hello, ' + declareVar(name);
  // "Hello, {_gt_, select, other {Brian}}"
}

gt(`${derive(getGreeting(name))}. How are you?`);
// "Hello, Brian. How are you?"
```

*注意：`declareVar` 只能在由 [`derive`](/docs/react/reference/functions/derive) 调用的函数中使用。若要移除用于字符串处理的 ICU 标记，请使用 [`decodeVars`](/docs/react/reference/functions/decode-vars)。*

## 工作方式 [#how-it-works]

当 `declareVar` 包装某个值时，它会：

1. 将该值转换为 ICU `select` 语句格式。
2. 将其标记为动态内容，以便进行翻译处理。
3. 在翻译哈希计算中将其排除。
4. 保留原始值，用于运行时插值。

输出结果是一个兼容 ICU MessageFormat 的字符串：

```tsx
declareVar('John'); // → "{_gt_, select, other {John}}"
```

## 参数 [#parameters]

| 参数                      | 描述              | 类型                                                 | 可选 | 默认值 |
| ----------------------- | --------------- | -------------------------------------------------- | -- | --- |
| [`variable`](#variable) | 要标记为变量的动态值。     | `string \| number \| boolean \| null \| undefined` | 否  | —   |
| [`options`](#options)   | 例如 `$name` 等选项。 | `object`                                           | 是  | —   |

### `variable` [#variable]

**类型** `string | number | boolean | null | undefined` · **必填**

要标记成变量的动态值。

### `options` [#options]

**类型** `object` · **可选**

变量的选项。`options.$name` (`string`) 用于为翻译上下文设置变量名，类似于 [`<Var>`](/docs/react/reference/components/var) 组件上的 `name` prop。

## 返回值 [#returns]

**类型** `string`

一个包含 ICU 兼容标记的 string，可保留原始值，并在运行时正确解析。

## 示例 [#examples]

*示例从 `gt-react` 导入；请改从你所用框架的 package 导入。*

```tsx title="BasicUsage.tsx"
import { derive, declareVar, gt } from 'gt-react';

function getGreeting(name) {
  return `Hello, ${declareVar(name)}!`;
}

function Component() {
  const name = 'Brian';
  const message = gt(`${derive(getGreeting(name))} Welcome back.`);
  return <p>{message}</p>;
}
```

```tsx title="WithOtherFunctions.tsx"
import { declareVar, derive, useGT } from 'gt-react';

function Component({ name1, name2 }) {
  const gt = useGT();
  const message = gt('Hello, {name1}! My name is ' + derive(declareVar(name2)), { name1 });
  return <p>{message}</p>;
  // "你好，Brian！我叫 Archie"
}
```

## 注意事项 [#notes]

* 仅在由 [`derive`](/docs/react/reference/functions/derive) 调用的函数内使用 `declareVar`。
* 它会添加 ICU 标记，可能会干扰字符串处理；需要时请使用 [`decodeVars`](/docs/react/reference/functions/decode-vars) 提取原始值。
* 变量不会被翻译，并会在运行时保留。
* 关于 JSX 形式，请参见 [`<Var>`](/docs/react/reference/components/var) 组件。

## Sitemap

See the full [sitemap](https://generaltranslation.com/sitemap.md) for all pages.