乐闻世界logo
2024年7月18日 01:18

The difference between router.pathname and router.route in Next.js

  • In Next.js, router.pathname and router.route are two properties related to routing, but they have subtle differences.
  • router.pathname indicates the path displayed in the browser's address bar; it is the path visible to the user for the current page. For example, when you access /about in the browser, router.pathname will be /about.
  • router.route also represents the path of the current page, but it refers to the actual path of the page file or template. For example, if you use dynamic routing, such as /blog/[slug], even if the browser address shows /blog/hello-world, router.route will still be /blog/[slug]. This means router.route represents the routing pattern or file structure, rather than the actual URL path.
  • In summary, router.pathname focuses on the actual URL path, while router.route focuses on the page file or template path, especially when using dynamic routing, where the difference is more pronounced.
标签：Next.js