概要

<Var> コンポーネントは、翻訳対象にしないコンテンツをレンダリングするために使用します。 変数やコードスニペット、その他の非翻訳コンテンツの表示に便利です。 また、API Keys や個人情報など、非公開にすべきコンテンツを表示する場合にも有用です。

<Var>{user.name}</Var>

<Var> コンポーネントは常に <T> コンポーネントの内側で使用します。 <Currency>、<DateTime>、<Num> に分類されない動的な値を扱うための汎用コンポーネントと考えてください。

リファレンス

Props

説明

返り値

翻訳対象外のコンテンツを含む JSX.Element を返します。

例

基本例

<Var> コンポーネントは、<T> コンポーネントの内部で使用する必要があります。

import { T, Var } from 'gt-next'

export default function Example(user) {
  return (
    <T>
      このテキストを翻訳してください！
      あなたの名前は: <Var>{user.name}</Var> // [!code highlight]
      <Var><p>Do not translate this text</p></Var> // [!code highlight]
    </T>
  );
}

注意事項

• Variable Components は、翻訳不可の動的コンテンツを維持するために不可欠です。
• 必ず <T> コンポーネント内で Variable Components を使用してください。
• <Num>、<Currency>、<DateTime> などのコンポーネントは、正確な書式で表示するためのローカリゼーション機能を提供します。

次のステップ

• <Var> コンポーネントや、<Currency>、<DateTime>、<Num> などの変数コンポーネントの詳しい解説と使用例は、 Variable コンポーネントの使い方 をご覧ください。
• 特定の Variable コンポーネントにおける書式設定の options については、APIリファレンス を参照してください。