自定义页面中的 NextJs route.push()

Question

我是next js的新手，现在还在练习中，但是遇到了一些问题，希望能找人帮我找出问题。

这是我的 route.push():

onClick={(e) => {
              const query = { oid: data.oid, customer: data.cid };

              const url = { pathname: '/orders/detail/', query };

              const urlAs = { pathname: '/orders/detail/', query };

              router.push(url, urlAs);
            }}

我希望我的 URL 看起来像 http://localhost:3000/orders/detail?id=1&customer=1

这是我的页面文件夹的样子 pages

为什么它没有在文件夹中呈现 `[oid].js'？

它在此处运行错误消息error message

感谢您的帮助和建议，这对我来说意义重大！！

Answer 1

使用该页面文件夹结构，您的 url 应该类似于 http://localhost:3000/orders/detail/someID/someOID。

urlAs 功能不再用于路由。 (https://nextjs.org/docs/api-reference/next/router#routerpush)

我会做

onClick={(e) => {
  router.push(`/orders/detail/${data.cid}/${data.oid}`);
}

或者你可以这样做：

onClick={(e) => {
  router.push({
              pathname: '/orders/detail/[id]/[oid]',
              query: { id: data.cid, oid: data.oid },
            });
}

自定义页面中的 NextJs route.push()

NextJs route.push() in custom page

next.js

router