Search code examples
reactjsroutesnext.jsnext-router

NextJS TypeError: Cannot read property 'pathname' of undefined

I am migrating an entire app from React to Next.js v12. I solved the majority of the problems but I'm having some trouble with routing.

I replaced useHistory with useRouter as we are not using react-router package anymore and I'm getting this final error on the page

enter image description here

The location should return the current URL of the page

Solution

  • Use the useRouter hook to access the router object. router has a pathname property.

    useRouter

    router

    pathname: String - Current route. That is the path of the page in /pages, the configured basePath or locale is not included.

    import { useRouter } from 'next/router';

...

const router = useRouter();
// router.pathname