Var
<Var> コンポーネントのAPIリファレンス
概要
<Var> コンポーネントは、翻訳してはいけないコンテンツを表示するために使用します。
変数やコードスニペット、その他の非翻訳コンテンツを表示するのに便利です。
また、API Keys や個人情報など、非公開にすべきコンテンツの表示にも有用です。
<Var>{user.name}</Var><Var> コンポーネントは、常に <T> コンポーネントの内部で使用します。
<Currency>、<DateTime>、<Num> のいずれにも当てはまらない動的な値を扱う、汎用的な受け皿と考えてください。
参考資料
Props(プロパティ)
Prop
Type
説明
| Prop | 説明 | 
|---|---|
| children | コンポーネント内に表示するコンテンツ。指定がある場合は value より優先されます。 | 
| value | children が指定されていない場合に表示される任意のデフォルト値。文字列を指定できます。 | 
返り値
翻訳対象外のコンテンツを含む JSX.Element を返します。
例
基本例
<Var> コンポーネントは、<T> コンポーネントの内側で使用する必要があります。
import { T, Var } from 'gt-react'
export default function Example(user) {
  return (
    <T>
      このテキストを翻訳してください!
      あなたの名前は:<Var>{user.name}</Var> // [!code highlight]
      <Var><p>このテキストは翻訳しないでください</p></Var> // [!code highlight]
    </T>
  );
}注意事項
- Variable Components は、翻訳対象外の動的コンテンツを保持するために不可欠です。
- 必ず <T>コンポーネントの内部で Variable Components を使用してください。
- <Num>、- <Currency>、- <DateTime>などのコンポーネントは、正確な書式を実現するローカリゼーション機能を提供します。
次のステップ
- <Var>コンポーネントや- <Currency>、- <DateTime>、- <Num>などの他の変数コンポーネントのより詳しい解説と使用例は、 Variable コンポーネントの使い方 のドキュメントをご覧ください。
- 各 Variable コンポーネントの書式設定 options については、APIリファレンス を参照してください。
このガイドはどうでしたか?

