在 Gatsby 站点修改路由

Question

我想在 Gatsby 博客中设置分页。在我的 pages/index.js 页面中，我存储了帖子、"chunked" 帖子（例如，每页 4 篇帖子）和当前页码：

this.state = {
  allPosts: props.data.allMarkdownRemark.edges,
  postChunks: [],
  currentpage: 0,
};

目前，如果我转到 localhost:8000，它会指向此组件，加载前 4 个帖子并显示它们。我希望能够转到 localhost:8000/page2 并让这条路线指向 same 组件。目前它将我带到 404 页面。我如何修改路由，以便所有 pageX 路由都转到相同的 index.js 组件？

Answer 1

如果你使用react-router你可以直接使用<Route path="/" component={Blog} />

从根“/”开始的任何路径都将转到同一个博客组件（您可以通过声明 'exact path' 来避免这种情况）。我猜你可以使用 url 来确定你显示哪个块。

Answer 2

使用 Gatsby，您可以通过编程方式创建路由。

查看 gatsby-paginate，它可以轻松创建分页索引页 https://github.com/pixelstew/gatsby-paginate/

在 Gatsby 站点修改路由

Modify routing in Gatsby site

javascript

reactjs

react-router

gatsby