使用 reactjs 更改 main index.html 上的语言

Question

我正在一个网站上工作，我正在努力使该网站支持多语言。在我的 index.html 我有两个标题，一个是英文的，另一个是葡萄牙语的。

  <head>
    <meta charset="utf-8" />
    <link rel="icon" href="%PUBLIC_URL%/favicon.png" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="theme-color" content="#000000" />
    <meta
      name="description"
      content="Web site created using create-react-app"
    />
    <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />

    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />

    <title > EN </title>
    <title lang = "pt-PT"> PT </title>

  </head>

所以默认语言是英语，如果浏览器的语言变成葡萄牙语，我想把它改成葡萄牙语。我已经换了葡萄牙语的浏览器，但语言还是英文

我对此还是个新手，我只想知道是否有一些代码或其他东西可以帮助我解决这个问题。

Answer 1

您可以使用react-helmet，它可以帮助您通过使用反应代码将内容放入<head>。把它放在你的根组件中。

import { Helmet } from "react-helmet"

const siteLanguage = 'pt-PT'

在您的渲染中

 return (
    ...
    <Helmet htmlAttributes={{
        lang: siteLanguage,
        }} 
    ><title lang={siteLanguage}>PT</title>
    </ Helmet>
    ...
    )

葡萄牙语语言代码可以是 'pt'、'pt-BR' 或 'pt-PT'

使用 reactjs 更改 main index.html 上的语言

change language on main index.html with reactjs

html

reactjs

multilingual