Abh*_*mar 14 html javascript reactjs
我正在开发一个反应项目。我在index.html中给出了默认的标题标签和元标签。我正在尝试使用React-helmet通过 props 更新每个页面的标题和元标记。标题标签会更新,但只更新几秒钟。每当我在 5-10 秒后更改浏览器选项卡时,标题就会恢复为默认值。至于其他元标记,这些标记根本不会覆盖。
索引.html
<head>
<title>Content...</title>
<meta name="description" content="description/>
</head>
Run Code Online (Sandbox Code Playgroud)
我的组件
<Helmet>
<title>{this.state.meta_title}</title>
<meta name="description" content={this.state.meta_description}/>
</Helmet>
Run Code Online (Sandbox Code Playgroud)
我尝试使用data-react-helmet="true"。
<meta name="description" content={this.state.meta_description} data-react-helmet="true"/>
Run Code Online (Sandbox Code Playgroud)
但这没有帮助。我过去两天试图解决这个问题,但没有成功。如果有人可以帮助我,请帮助。
更新
我得到了解决方案。我在页面内调用头盔。当我在App.js文件中调用Helmet组件时,它开始工作。标题问题已修复,但元标记未更新。新的元标签可以添加到头部的底部。
data-react-helmet="true" 现在替换为 data-rh="true"
就像@TomFinney 说的:只需添加 data-react-helmet="true"到index.html. 由于react-helmet 在更新它们时通过属性来识别这些元素。
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" />
Run Code Online (Sandbox Code Playgroud)
App.jsx:
<Helmet>
<title>From Helmet</title>
<meta name="description" content="From Helmet" />
</Helmet>
Run Code Online (Sandbox Code Playgroud)
作品: https: //e8bnj8.csb.app/ | https://codesandbox.io/s/tender-gould-e8bnj8?file=/src/App.js
您可以通过在浏览器中禁用 javascript 来测试它。
| 归档时间: |
|
| 查看次数: |
10988 次 |
| 最近记录: |