# General Translation React SDKs (gt-react, gt-next): getTranslationsSnapshot
URL: https://generaltranslation.com/ja/docs/react/reference/functions/get-translations-snapshot.mdx
---

title: getTranslationsSnapshot
description: General Translation の gt-react プロバイダー用にロケールの翻訳を読み込みます。getTranslationsSnapshot の API リファレンス。

---

`getTranslationsSnapshot` 関数は、[`<GTProvider>`](/docs/react/reference/components/gt-provider) が `translations` prop に期待する形式で、指定したロケールの翻訳を読み込みます。初期化後にこの関数を呼び出すと、プロバイダー が同期的に使用する スナップショット を生成できます。

*`gt-react`、`gt-next`、`gt-tanstack-start`、`gt-react-native` で利用できます。例では `gt-react` からインポートしていますが、代わりに使用しているフレームワークのパッケージからインポートしてください。*

## 概要 [#overview]

`gt-react` を[初期化](/docs/react/reference/config#initialization)したら、アクティブなロケールの `getTranslationsSnapshot` を await し、その結果をプロバイダーに渡します。

```tsx
const translations = await getTranslationsSnapshot(locale);
```

*注: `getTranslationsSnapshot` は、参照する翻訳キャッシュを用意する [`initializeGT`](/docs/react/reference/config#initialize) または [`initializeGTSPA`](/docs/react/reference/config#initialize-spa) の後で呼び出してください。*

## 仕組み [#how-it-works]

初期化時に翻訳がキャッシュに読み込まれ、`getTranslationsSnapshot` はロケールごとのキャッシュ済み翻訳のシリアライズ可能な スナップショット を返します。この スナップショット を [`<GTProvider>`](/docs/react/reference/components/gt-provider) に渡すことで、読み込み時のちらつきなく翻訳済みコンテンツを同期的に render できます。

## パラメータ [#parameters]

| パラメータ               | 説明              | 型        | 任意  | デフォルト |
| ------------------- | --------------- | -------- | --- | ----- |
| [`locale`](#locale) | 翻訳を読み込む対象のロケール。 | `string` | いいえ | —     |

### `locale` [#locale]

**型** `string` · **必須**

読み込む翻訳のロケールを、BCP 47 コードで指定します。

## 戻り値 [#returns]

**型** `Promise<Record<Locale, Record<Hash, Translation>>>`

ロケールの翻訳スナップショットに解決される Promise です。`translations` prop として `<GTProvider>` が想定する形式になっています。

## 例 [#examples]

```tsx title="src/routes/root.tsx"
import {
  GTProvider,
  initializeGT,
  getTranslationsSnapshot,
  parseLocale,
} from 'gt-react';
import gtConfig from '../../gt.config.json';

const loadTranslations = (locale: string) =>
  import(`../_gt/${locale}.json`).then((m) => m.default);

initializeGT({ ...gtConfig, loadTranslations });

export async function loadRoot(request: Request) {
  const locale = parseLocale(request);
  return {
    locale,
    translations: await getTranslationsSnapshot(locale), // [!code highlight]
  };
}

export function Root({ locale, translations, children }) {
  return (
    <GTProvider locale={locale} translations={translations}>
      {children}
    </GTProvider>
  );
}
```

## メモ [#notes]

* 初期化が完了したら `getTranslationsSnapshot` を呼び出します。
* その結果を [`<GTProvider>`](/docs/react/reference/components/gt-provider) の `translations` prop に渡します。