gpt4 book ai didi

javascript - React Helm 不覆盖标题和元标记

转载 作者:行者123 更新时间:2023-12-05 00:27:53 26 4
gpt4 key购买 nike

我正在开发一个 react 项目。我在 中给出了默认的标题标签和元标签index.html .我正在尝试使用 通过 Prop 更新每个页面的标题和元标记 react Helm .标题标签会更新,但只有几秒钟。每当我在 5-10 秒后更改浏览器选项卡时,标题都会恢复为默认值。至于其他元标记,这些标记根本不会覆盖。

index.html

<head>
<title>Content...</title>
<meta name="description" content="description/>
</head>

我的组件
<Helmet>
<title>{this.state.meta_title}</title>
<meta name="description" content={this.state.meta_description}/>
</Helmet>

我尝试使用 data-react-helmet="true" .
<meta name="description" content={this.state.meta_description} data-react-helmet="true"/>

但这没有帮助。我试图从过去两天解决这个问题,但没有运气。如果有人可以帮助我,请帮助。

更新

我得到了解决方案。我调用 Helm 页面内。当我调用 Helm 中的组件应用.js 文件,它开始工作。标题问题已修复,但元标记未更新。新的元标签可以添加到头部的底部。

最佳答案

就像@TomFinney 说的:只需添加 data-react-helmet="true"index.html 中的标签.从 react-helmet identifies these elements by the attribute when you update them .index.html :

<title>From Index</title> <!-- title is an exception and does not require it -->
<meta name="description" content="From Index" data-react-helmet="true" />
App.jsx :
<Helmet>
<title>From Helmet</title>
<meta name="description" content="From Helmet" />
</Helmet>
作品: https://e8bnj8.csb.app/ | https://codesandbox.io/s/tender-gould-e8bnj8?file=/src/App.js
您可以通过在浏览器中禁用 javascript 来测试它。

关于javascript - React Helm 不覆盖标题和元标记,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60547576/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com