Question

我正在寻找一种以多种语言翻译完整网站（主页，关于我们，产品页面，联系方式，常见问题解答......）的方法。该网站使用Firebase数据库构建在ReactJS中。

我发现的所有例子都只是一些小问题，比如问候语或者您是如何使用完整网站的？我最好的选择是为每种语言制作JS对象，并使用数百种可能的模板字符串吗？（这绝对应该是“#page; homepageContactSectionSubDiscription＆＃39; homepageProductSectionFeaturesItemTwo＆＃39;”等标签。

Answer 1

您应该考虑使用react-intl。 Github

您可以指定各种语言文件：

en.json

{
    "greeting": "Hello"
}

es.json

{
    "greeting": "Hola"
}

然后使用FormattedMessage：

在您的组件中使用它们

import { FormattedMessage } from 'react-intl';
...
<FormattedMessage id="greeting" />

React intl为您的应用程序提供了一个包装器，允许指定不同的语言及其相关消息。

ReactDOM.render(
    <IntlProvider locale="en">
        <App />
    </IntlProvider>,
    document.getElementById('app')
);

重要提示，这不会为您执行翻译，但会为您提供一种根据指定的locale从不同语言文件中提取的方法。

如果您发现自己拥有一个非常大的语言文件，则可以将其拆分为不同的部分。例如，我可能有两个文件home.json和settings.json，我可以将其设置为home.{unique_id}或settings.{another_unique_id}

ReactJS中的多语言网站

1 个答案: