javascript - 如果我们导航到其他页面，为什么在 React js 中显示用于 seo 的 index.html 标签？

Question

我是 React js 的新手，试图为网站设置 SEO，但它首先向我显示 index.html 标签，之后我在 head 标签中显示的标签中设置的内容我只想显示该页面的特定元标签。 ..如何在 React js 中做到这一点，请帮我......

Answer 1

在 React 中，进行 SEO 的首选方法是使用 react-helmet

尝试react-helmet在 React 应用程序中设置 SEO 标签。

同时从index.js中删除所有SEO

代码非常简单。

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

class Application extends React.Component {
  render () {
    return (
        <div className="application">
            <Helmet>
                <meta charSet="utf-8" />
                <title>My Title</title>
                <link rel="canonical" href="example.com" />
            </Helmet>
            ...
        </div>
    );
  }
};

React Helm 的功能

• 支持所有有效的头标签:标题、基本、元、链接、脚本、noscript 和样式标签。
• 支持 body、html 和 title 标记的属性。
• 支持服务器端渲染。
• 嵌套组件会覆盖重复的头部更改。
• 在同一组件中指定时，会保留重复的头部更改(支持“apple-touch-icon”等标签)。
• 用于跟踪 DOM 更改的回调。