# General Translation React SDKs (gt-react, gt-next, gt-react-native): DictionaryTranslationOptions
URL: https://generaltranslation.com/zh/docs/react/reference/types/dictionary-translation-options.mdx
Docs index: https://generaltranslation.com/llms.txt
Description: 用于向词典条目传递变量的选项。DictionaryTranslationOptions 的 API 参考。

`DictionaryTranslationOptions` 是用于词典查找的选项对象，包含会插入词典条目的插值变量。它可作为 [`useTranslations`](/docs/react/reference/hooks/use-translations) 返回函数的参数传入。

*这些选项适用于所有支持 [`useTranslations`](/docs/react/reference/hooks/use-translations) 的环境——`gt-react`、`gt-next`、`gt-tanstack-start` 和 `gt-react-native`。*

## 概览 [#overview]

将插值变量作为普通键传递。每个键都对应词典条目中的一个 `{name}` 占位符。

```typescript
type DictionaryTranslationOptions = {
  [variable: string]: unknown; // 插值变量
};
```

*注意：在 `gt-react` v11 中，传给 [`useTranslations`](/docs/react/reference/hooks/use-translations) 的 `options` 参数类型为 `TranslationVariables` (`Record<string, unknown>`) ；`DictionaryTranslationOptions` 是这种结构的参考名称。变量会以格式化后的形式插入译文中，但其本身绝不会被翻译。*

## 属性 [#properties]

| 属性                        | 描述                      | 类型                        |
| ------------------------- | ----------------------- | ------------------------- |
| [`variables`](#variables) | 插值所用的值，以条目中使用的占位符名称作为键。 | `Record<string, unknown>` |

### `variables` [#variables]

**类型** `Record<string, unknown>`

每个键都标识其值应插入词典条目的位置。在条目中使用 `{name}` 语法引用变量；其值会直接插入已翻译的字符串中，不会再被翻译。值也可以使用 [ICU message format](https://unicode-org.github.io/icu/userguide/format_parse/messages/) 进行格式化。

## 示例 [#examples]

```tsx title="dictionary.ts"
const dictionary = {
  greeting: {
    hello: 'Hello, {username}!', // {username} 是一个插值变量
  },
};

export default dictionary;
```

```tsx title="Component.tsx"
import { useTranslations } from 'gt-react';

const Component = () => {
  const t = useTranslations();
  // 传入 { username } 以填充 {username} 占位符
  return <div>{t('greeting.hello', { username: 'Brian123' })}</div>;
};
```

```tsx title="dictionary.ts"
const dictionary = {
  account: {
    // ICU message format 将变量格式化为 Currency
    balance: 'Your account balance: {dollars, number, ::currency/USD}!',
  },
};

export default dictionary;
```

```tsx title="Component.tsx"
import { useTranslations } from 'gt-react';

const Component = () => {
  const t = useTranslations();
  return <div>{t('account.balance', { dollars: 1000000 })}</div>;
};
```

## 备注 [#notes]

* `DictionaryTranslationOptions` 与 [`useTranslations`](/docs/react/reference/hooks/use-translations) 搭配使用，用于向词典条目传递变量。
* 关于内联字符串翻译，请参阅 [`InlineTranslationOptions`](/docs/react/reference/types/inline-translation-options)。
* 有关设置和使用约定，请参阅 [词典指南](/docs/react/guides/translating-with-dictionaries)。

## Sitemap

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