gt@2.11.3
概要
derive() がオブジェクトや 配列 へのアクセスをサポートするようになりました。以前の derive() で解決できたのは関数呼び出しだけでしたが、現在はオブジェクト、配列、辞書から値を解決できるため、ルックアップ pattern をより簡単に扱えるようになりました。
これは、gt-react@10.15.0 でリリースされた derive() in tagged templates をベースにした機能です。
新機能
オブジェクトアクセス
オブジェクトのプロパティ参照では derive() を使用します。CLI は抽出時に、取り得るすべての値を静的に特定します。
const statusMessages = {
success: "Your order has been placed.",
pending: "Your order is being processed.",
error: "Something went wrong with your order.",
} as const;
export default function OrderBanner({ status }: { status: string }) {
return <p>{t`Thanks for shopping! ${derive(statusMessages[status])}`}</p>;
}CLI は、取り得る各値に対して個別の翻訳を抽出します。
"ご購入ありがとうございます。ご注文を受け付けました。""ご購入ありがとうございます。ご注文を処理中です。""ご購入ありがとうございます。ご注文の処理中に問題が発生しました。"
静的なアクセス (statusMessages.success) と動的なアクセス (statusMessages[status]) の両方に対応しています。
配列へのアクセス
配列も同様です:
const steps = [
"Create your account",
"Verify your email",
"Start your first project",
] as const;
export default function Onboarding({ step }: { step: number }) {
return <h2>{t`Step ${step + 1}: ${derive(steps[step])}`}</h2>;
}抽出されたエントリ:
"ステップ {step + 1}: アカウントを作成""ステップ {step + 1}: メールアドレスを確認""ステップ {step + 1}: 最初のプロジェクトを開始"
ネストされたアクセス
オブジェクトや配列へのアクセスを、任意の深さまで連鎖できます。
const content = {
greetings: {
formal: "Good morning.",
casual: "Hey!",
},
} as const;
// derive(content[category][style]) は動作しますPython サポート
Python でも、同じパターンを t() と一緒に使えます。derive() は、第1引数として渡すか、f-string 内で使用します。
badges = {
"admin": "Administrator",
"mod": "Moderator",
"user": "Member",
}
# 単独のderive
t(derive(badges[role]))
# 周囲のコンテキストを付与するf-string内のderive
t(f"Logged in as {derive(badges[role])}")抽出されたエントリ:
"管理者としてログイン中""モデレーターとしてログイン中""Memberとしてログイン中"