我的 React-Helmet 在我的登录组件中不起作用?
My React-Helmet isn't working in my login component?
我不明白我在将 React-Helmet 引入我的网站组件时做错了什么。
我已经使用终端命令安装了 react-helmet:npm install --save react-helmet
我的 index.html 文件中没有“标题”或“描述”标签。
这是 .js 文件中的压缩组件代码:
...
import { Helmet } from 'react-helmet';
class LoginFullscreen extends Component {
...
return (
<div className='login-fullscreen-background'>
<Helmet>
<title>Unlocked Academy: Login to the Platform</title>
<meta name="description" content="Welcome to Unlocked Academy! Login here to access your account and prepare the flashcards you will engage with after each phone unlock and passing screen time!" />
</Helmet>
...
</div>
);
...
}
这是我的 index.html 文件:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%PUBLIC_URL%/Favicon32x32.png" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" />
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
</head>
<body style="background-color: #3A3149;">
<noscript>I'm So Sorry, but Unlocked Academy requires you to have JavaScript enabled to run.
</noscript>
<div id="root">
</div>
</body>
</html>
当我尝试时,它对我来说效果很好。但是,如果您右键单击并查看页面源代码,您将看不到它。但是如果你打开你的开发者工具并检查元素,你会看到所有的东西。
这里有一个例子:https://stackblitz.com/edit/react-cmjz7v
我不明白我在将 React-Helmet 引入我的网站组件时做错了什么。
我已经使用终端命令安装了 react-helmet:npm install --save react-helmet
我的 index.html 文件中没有“标题”或“描述”标签。
这是 .js 文件中的压缩组件代码:
...
import { Helmet } from 'react-helmet';
class LoginFullscreen extends Component {
...
return (
<div className='login-fullscreen-background'>
<Helmet>
<title>Unlocked Academy: Login to the Platform</title>
<meta name="description" content="Welcome to Unlocked Academy! Login here to access your account and prepare the flashcards you will engage with after each phone unlock and passing screen time!" />
</Helmet>
...
</div>
);
...
}
这是我的 index.html 文件:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%PUBLIC_URL%/Favicon32x32.png" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" />
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
</head>
<body style="background-color: #3A3149;">
<noscript>I'm So Sorry, but Unlocked Academy requires you to have JavaScript enabled to run.
</noscript>
<div id="root">
</div>
</body>
</html>
当我尝试时,它对我来说效果很好。但是,如果您右键单击并查看页面源代码,您将看不到它。但是如果你打开你的开发者工具并检查元素,你会看到所有的东西。
这里有一个例子:https://stackblitz.com/edit/react-cmjz7v