Next.js 添加 slug/params 来清理 URL

IT技术 reactjs next.js slug next-router
2021-05-24 13:24:39

我在“页面”文件夹中有一个带有干净 URL 的结构，就像这样......

/pages/items/[pageNumber]/index.tsx

如果我使用router.push它，我会像这样使用它来访问该页面......

router.replace("/items/[pageNumber]", "/items/1")

这很好用，但现在我想向该 URL 添加一个查询参数（用于过滤器），我该怎么做？

我试过这个...

router.push(`/items/[pageNumber]/`, `/items/1/?${filterParams}`, { shallow: true });

但这不起作用，我想知道如何做到这一点。

1个回答

当你像这样使用它时

router.push(`/items/[pageNumber]/`, `/items/1/?${filterParams}`, { shallow: true });

您没有将查询参数传递给页面，我猜您只是在地址栏中显示它们。

这样的事情怎么样：

router.push({
  pathname '/items/[pageNumber]/',
  query: {
    param1: 'yes',
  },
}, {
  pathname: '/items/1/',
  query: {
    param1: 'yes',
  },
});

不要忘记query为您的案例更新部分。

其它你可能感兴趣的问题
上一篇React，表单刷新问题 下一篇如何处理 useEffect 闭包内的陈旧状态值？