如何在nextjs中动态设置元标记

next.js React.js

Gil伽罗小宇宙

2020-03-23

如何在下一个js中使用NextHead并设置打开图形标记。我正在从详细信息页面传递道具,但是它没有出现在源代码中。

<NextHead>
    <title>{title}</title>
    <meta property="og:type" content="website"/>
    <meta name="description" content={description}/>
    <meta property="og:title" content={title}/>
    <meta name="description" content={description}/>
    <meta name="keywords" content={keyword}/>
    <meta property="og:url" content={url}/>
    <meta property="og:description" content={description}/>
    <meta property="og:image" content={image}/>
</NextHead>

第3126篇《如何在nextjs中动态设置元标记》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

2个回答
乐达蒙 2020.03.23

问题之一是Next.js Head组件要求所有元标记都具有name属性。我没有在任何地方看到此文档,我相信这就是为什么例如

<meta property="og:url" content={url}/>

from the original question did not end up in the DOM. It took me quite some time to understand this gotcha, so I hope this helps someone.

西里神奇 2020.03.23

为什么需要在每个页面上标记元数据?它应该在您的根页面上设置。试试这个插件,https://github.com/garmeeh/next-seo

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android