我的 React-Helmet 在我的登录组件中不起作用?

问题描述 投票:0回答:1

我不明白我在网站组件中引入 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>

meta-tags react-helmet
1个回答
2
投票

当我尝试时,它对我来说效果很好。但是,如果您右键单击并查看页面源代码,您将无法看到它。但是,如果您打开开发人员工具并检查元素,您将看到所有内容。

这是一个示例:https://stackblitz.com/edit/react-cmjz7v

© www.soinside.com 2019 - 2024. All rights reserved.