How to programmatically change a route in Next.js

May 10, 2021

Learn how to programmatically change a route in Next.js with the useRouter hook and router.push(), or the Router object when you are outside a component.

~~~

In a component, you can use the useRouter hook:

import { useRouter } from 'next/router'

//...

const router = useRouter()

router.push('/test')

Sometimes you can’t, for example when you’re not in a React component, maybe in a utility function.

In that case, you can do this:

import Router from 'next/router'

Router.push('/test')

Tagged: Next.js · All topics

~~~