# General Translation React SDKs (gt-react, gt-next): DictionaryTranslationOptions
URL: https://generaltranslation.com/ja/docs/react/reference/types/dictionary-translation-options.mdx
---

title: DictionaryTranslationOptions
description: General Translation gt-react で辞書エントリに変数を渡すためのオプション。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` の 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} はinterpolation変数です
  },
};

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) を参照してください。