Nextjs 嵌套动态路由

Question

http://localhost:3000/category/leadership/expert

http://localhost:3000/category/topics/technology/business-tech-blogs

我有这样的类别路线。当前文件看起来像这样pages/category/[...slug].js。它使用 ISR 并且工作没有问题。

现在我需要为每条路线提供一条供稿页面的路线。 示例

http://localhost:3000/category/leadership/expert/feed

http://localhost:3000/category/topics/technology/business-tech-blogs/feed

如何为此定义文件。这将是 SSR，因为 ISR 不支持 xml 内容。

我尝试了pages/category/[slug]/[...params].js，它可以工作，但它破坏了我的类别页面。

Answer 1

您无需创建新路线。您唯一需要做的就是检查最后一个参数，如果是 feed，则呈现您的 Feed 页面。

代码如下所示

const Category = () => {
  const router = useRouter();
  const { params } = router.query;

  const lastParam = Array.isArray(params) ? [...params].pop() : null;

  if (lastParam === 'feed') {
    return (
      <span>
        Feed Page
      </span>
    );
  }

  return (
    <span>
      Category Page
    </span>
  );
};