如何从盖茨比的网址中删除插入的页码

时间:2020-06-29 19:06:42

标签: javascript reactjs gatsby

我正在使用Gatsby创建博客,并在gatsby-node.js文件中创建了“分页页面”,如图所示。在一定数量的帖子之后,这将创建一个新页面。

然后在我的templates/allPosts.js文件中,我对这些帖子进行映射,并对每个帖子都有一个<Link to={frontmatter.slug} />。所有链接都可以在首页上正常运行,但是在此之后,例如在第2页上,页码被插入到该段之前的URL中,但这不是博客文章的正确URL。我需要不插入页码。

Creating paginated pages in the gatsby-node.js file

2 个答案:

答案 0 :(得分:1)

因此,根据您所说的,您想要保留页面结构(即/blog/number/),但帖子slug必须删除该数字,不是吗?

然后,在该帖子的链接上,使用一个绝对URL,例如:<Link to={`/blog/page-title`}>而不是<Link to={`page-title`}>。请注意,如果要删除和使用绝对路径,则必须在链接前面加上斜杠(/)。您还可以检查(因为您的问题中没有代码)是否使用诸如../post-title之类的相对路径。

您可能想看看Gatsby's documentation about relative links

答案 1 :(得分:1)

根据relative links上Gatsby文档中的部分,您应该能够为{slug}加上标签前缀,以删除网址中的网页组件。

/..组件遵循@ reach / router的行为,通过忽略尾部斜杠并将每个页面视为相对目录来解决相对链接时的行为。例如,如果您使用的是<Link />/blog/my-great-page(请注意斜杠),则指向/blog/my-great-page/的链接会将您带到../second-page

为保持一致,您可能还希望将页码添加到第一页。