Accessing Query Params in Next.js

Tuesday, September 22, 2020

I've been building a new side project in Next.js and it's not too different from React. And I'm afraid I have carried over some of my habits from React to Next.js.

One such occurrence happened when I was trying to access the query params in my Next.js app. The first thing that came to mind was to install the react-router-dom and use the useLocation function from its API to get the location then access the query params but it was fruitless. Next.js already has its own in-built router.

To access the query params in Next.js, you only need 3 lines of code with no additional library

	import { useRouter } from 'next/router';
	let router = useRouter();

That's it.

Powered By Swish