javascript - 如何在 react js 中动态更改网站的标题(也在源代码中)？

Question

我尝试了 react-helmet。我使用了 React 路由器，我想在路由更改时更改标题。使用 react-helmet，我可以更改选项卡和控制台中的标题，但遗憾的是源代码中没有。我也想更改源代码中的标题，因为它对 seo 非常重要。
在/public/index.html

<title>My Title</title>
<meta name="description" content="This is main page"/>

在 src/app.js

import React from 'react';
import {
  BrowserRouter as Router,
  Switch,
  Route,
  Link
} from "react-router-dom";
import {Helmet} from "react-helmet";
import Home from './Components/Pages/Home/';

function App() {
  return (
   <Router>
    <Helmet>
         <meta charset="utf-8" />
   <title>My title</title>
   <meta name="description" content="This is main page" />
        </Helmet>
      <Switch>
        <Route path="/home">
          <Home></Home>
        </Route>
        </Switch>
        </Router>
        );
        }
        export default App;

在 Home.js

import React from 'react';
import {Helmet} from "react-helmet";

function Home() {
  return (
  <div>
           <Helmet>
         <meta charset="utf-8" />
   <title>Home Title</title>
   <meta name="description" content="This is home page" />
        </Helmet>

  </div>
  );};

Answer 1

如果您正在寻找 SEO，那么 create-react-app不是这里的解决方案。
即使您在社交媒体上分享您的页面，它也不会显示元数据。
您必须为此进行服务器端渲染。要阅读有关服务器端渲染的信息，请查看此处
https://medium.com/@yudhajitadhikary/client-side-rendering-vs-server-side-rendering-in-react-js-next-js-b74b909c7c51