# General Translation React SDKs (gt-react, gt-next): Tx
URL: https://generaltranslation.com/zh/docs/react/nextjs/reference/components/tx.mdx
---

title: Tx
description: 使用 General Translation 在 Next.js App Router 的服务器组件中翻译请求时的 JSX。Tx 的 API 参考。

---

`<Tx>` 组件通过 General Translation API 在请求时翻译 JSX。适用于构建时无法确定的 dynamic content；静态源内容请使用 [`<T>`](/docs/react/reference/components/t)。

`<Tx>` 仅可用于服务器端，不适用于 Pages Router。

## 概览 [#overview]

```tsx
import { Tx } from 'gt-next/server';

<Tx context="Greeting loaded at request time">Welcome back</Tx>;
```

## 属性 [#props]

| 属性           | 描述              | 类型          | 可选 | 默认值       |
| ------------ | --------------- | ----------- | -- | --------- |
| `children`   | 要翻译的 JSX 内容。    | `ReactNode` | 否  | —         |
| `context`    | 用于指导翻译的上下文。     | `string`    | 是  | —         |
| `maxChars`   | 翻译后内容的最大长度。     | `number`    | 是  | —         |
| `locale`     | 目标区域设置覆盖。       | `string`    | 是  | 当前请求的区域设置 |
| `[variable]` | 插入到翻译后内容中的命名变量。 | `ReactNode` | 是  | —         |

## 返回值 [#returns]

**类型** `Promise<ReactNode>`

## 示例 [#example]

```tsx title="app/profile/page.tsx"
import { Tx } from 'gt-next/server';

export default async function ProfilePage() {
  return <Tx context="Account page heading">Welcome back</Tx>;
}
```