使用react -头盔结果在react CSR页面上生成2组元标记。

Question

我正在使用反应头盔作为我的反应项目。

我的index.html中的元标记是：

<link rel="canonical" href="https://example.com" />
<meta name="description" content="main description">

在组件中，我将元标记设置为：

const ContactUs = () => {
return (
    <div className="less-content-container justify-content-start align-items-start">
        <Helmet>
            <title>Contact Us | Example</title>
            <meta name="description" content={"contact us description"} />
            <link rel="canonical" href={"https://example.com/contact-us"} ></link>
        </Helmet>
    </div>
  );
}

当在浏览器中最后联系我们页面呈现时，我在Chrome检查呈现的html中看到了两组元标记。第一组元标记是index.html的元标记，第二组元标记是在组件中声明的。

另外，在Google控制台中，我看到用户声明的规范设置为none。这意味着。Google爬虫没有读取规范的元标签。

Answer 1

得到完全相同的问题，并通过在我的data-react-helmet="true"上的定义中添加一个index.html属性来修正它。就像这样：

<meta name="description" content="main description" data-react-helmet="true" />

在启动时，React头盔应该替换index.html上的描述。