Components

Var

<Var> 组件 API 参考

概览

<Var> 组件用于渲染不应被翻译的内容。 这对于渲染变量、代码片段或其他不应翻译的内容非常有用。 此外,它也适用于渲染应保持私密的内容,例如 API Keys 或个人信息。

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

<Var> 组件始终在 <T> 组件内部使用。 它可作为对不属于 <Currency><DateTime><Num> 类别的动态值的通用占位。

参考资料

属性

Prop

Type

描述

Prop描述
children组件内部要渲染的内容。若提供,将优先于 value 生效。
value可选的默认值,在未提供 children 时显示。可以为字符串。

返回

包含不应被翻译内容的 JSX.Element


示例

基本示例

必须在 <T> 组件内使用 <Var> 组件。

Example.jsx
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>)的讨论与用法示例, 请参阅使用变量组件文档。
  • API 参考 中了解特定变量组件的格式化 options 的更多信息。

本指南如何?