翻译字符串

概述

本指南是一个关于如何在您的 React 应用中使用 useGT() 翻译字符串的分步教程。

设置

先决条件

我们假设您已经在项目中安装了 gt-react，并且已经遵循或正在遵循快速入门指南。

翻译字符串

对于任何字符串，使用 useGT()。请记住，useGT() 必须在 <GTProvider> 的子组件中调用。

src/components/MyComponent.jsx

import { useGT } from 'gt-react';
 
export default function MyComponent() {
  const t = useGT(); 
  return (
    <div>
      <h1>{t('This is a string that gets translated')}</h1> // [!code highlight]
    </div>
  );
}

添加变量

变量是可能会改变的值，但不会被翻译。要将变量添加到您的字符串中，请使用以下模式：

MyComponent.jsx

import { useGT } from 'gt-react';
 
export default function MyComponent() {
  const t = useGT(); 
  return (
    <div>
      <h1>{t('Hello there, {username}', { variables: { username: 'Brian123' }})}</h1> // [!code highlight]
    </div>
  );
}

注意事项

对于字符串翻译，使用 useGT()。
可以使用 { variables: { key: value } } 模式将变量添加到字符串中。

下一步

返回到快速入门指南以完成项目的翻译设置。
查看useGT()的API参考。

翻译字符串

概述

设置

先决条件

翻译字符串

添加变量

注意事项

下一步

在本页面