# General Translation Changelog: gt-react 10.13.0: タグ付きテンプレートリテラルとしての t
URL: https://generaltranslation.com/ja/blog/gt-react_v10_13_0.mdx
Docs index: https://generaltranslation.com/llms.txt
Description: 
Authors: Ernest McCarter
Published: 2026-03-18

## 概要

[React コンテキスト からの脱却に向けた継続的な試み](/devlog/gt-react_v10_12_0)の一環として、`gt-react` では [`t`](/docs/react/reference/functions/t-function) をタグ付きテンプレートリテラルとして使えるようになりました。

```jsx
import { t } from "gt-react/browser";

const greeting = t`Hello, ${name}!`;
```

これは、既存の[`t()`](/docs/react/reference/functions/t-function)関数呼び出しの別構文です。ICU形式のプレースホルダーを記述して オプションオブジェクト を渡す代わりに、通常の JavaScript テンプレートリテラルを書くだけで、変数の補間は自動的に処理されます.

## 変更前と変更後

```jsx
// 変更前 — ICUプレースホルダー + オプションオブジェクト
t("Hello, {name}! You have {count} items.", { name, count })

// 変更後 — タグ付きテンプレートリテラル
t`Hello, ${name}! You have ${count} items.`
```

タグ付きテンプレート形式では、プレースホルダーに名前を付けたり、変数参照を重複して書いたりする必要がなくなります。文字列は、通常のJavaScriptのテンプレートリテラルと同じ感覚で記述できます。


## React コンテキストは不要

[gt-react@10.12.0](/devlog/gt-react_v10_12_0) で導入された [`t()`](/docs/react/reference/functions/t-function) 関数と同様に、タグ付きテンプレート形式も React コンテキストに依存しません。ブラウザコード内ならどこでも使用できます。

* **イベントハンドラー**: ``onClick={() => alert(t`Saved!`)}``
* **ユーティリティ関数**: ``function formatError(code) { return t`Error: ${code}` }``
* **定数と設定**: ``const LABELS = { save: t`Save`, cancel: t`Cancel` }``
* **React コンポーネントの外でも使用可能**

## グローバル登録

[`t`](/docs/react/reference/functions/t-function) を毎回各ファイルでインポートしたくない場合は、グローバルに登録できます。

```js
// アプリのエントリーポイント（例：layout.tsx）
import "gt-react/macros";
```

これにより `globalThis.t` が設定され、明示的に import しなくても、どこからでもタグ付きテンプレートを利用できます。

## 例

```jsx
import { t } from "gt-react/browser";

export function Greeting({ name }) {
  return <p>{t`Hello, ${name}!`}</p>;
}

export function SaveButton() {
  return (
    <button onClick={() => alert(t`Changes saved!`)}>
      {t`Save`}
    </button>
  );
}
```

または、グローバル登録を使う場合:

```jsx
// インポート不要 — t は globalThis に登録されています
const LABELS = {
  save: t`Save`,
  cancel: t`Cancel`,
  delete: t`Delete`,
};
```


## リンク

* [前回の開発ログ: React コンテキスト からの脱却 (gt-react@10.12.0)](/devlog/gt-react_v10_12_0)
* [`t()` API リファレンス](/docs/react/reference/functions/t-function)
* [PR #1118](https://github.com/generaltranslation/gt/pull/1118)

## Sitemap

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