<T> 组件

将您的内容包装在 <T> 组件中进行翻译。

<T>This content will be translated</T>

Props

变量

将更改的值（例如名称或计数）包装在 v() 中：

import { T, v } from '@magic-translate/react';

<T>
  Hello {v(user.name)}, you have {v(count)} unread messages
</T>

Magic Translate 一次将值周围的文本翻译为 Hello {0}, you have {1} unread messages，然后将这些值放回您的应用程序中。翻译已缓存，适用于每个名称和每个计数，并且值本身永远不会发送到 Magic Translate。

这些值按其出现的顺序进行编号。翻译可以将它们移动到语言需要的任何地方，例如 {1} ungelesene Nachrichten für {0}。

v() 还可以容纳 React 组件，例如链接：

<T>
  Read our {v(<Link href="/terms">terms</Link>)} before you continue.
</T>

那么，链接文本不会被翻译。要同时进行翻译，请将其放入自己的 <T> 中：v(<Link href="/terms"><T>terms</T></Link>)。

如果没有 v()，则将值与其周围的文本一起翻译。这行得通，但是每个不同的值都是单独的转换，计入您的使用量。

局限性

1. 你不能将 React 组件放在 <T> 组件中，除非放在 v() 中。纯 HTML 元素没问题（参见下面的示例）。
2. <T> 组件中的内容不能超过 10 KB，也就是大约 5,000 个字符。

{/* this is OK, since <a> is a plain HTML element */}
<T>
  <a href="mailto:info@i42.ch">Please send us an email</a>
</T>

{/* this does NOT work, since <MyButton> is a React component */}
<T>
  <MyButton>Click me</MyButton>
</T>