Next.js Discord

Discord Forum

The redirect function doesnt work in client component

Answered
Cane Corso posted this in #help-forum
Open in Discord
Avatar
Cane CorsoOP
Hey, how can I use redirect function in a client component with params?
for example my base page is "/[game]/profile/[userId]/home the game and the userId defined obviously, and i want to redirect the user to /[game]/profile/[userId]/second-page
I tried making this function:
const handleTabs = (newRoute: React.Key) => {
        redirect(`${asPath}${newRoute}`)
    }

where asPath is for example: /some-game/profile/123/second-page but It wont redirect the user no matter what, how can I solve this?
also from what i read, the redirect function should work in client components..
Answered by Cane Corso
ok router.push fixed the issue, which is dumb since redirect should work in client component
View full answer

2 Replies

Avatar
Cane CorsoOP
ok router.push fixed the issue, which is dumb since redirect should work in client component
Answer
Avatar
joulev
This will clarify why the redirect doesn’t work in that case https://github.com/vercel/next.js/pull/56067

Tldr redirect only works during rendering, if you call it inside useEffect or event handlers it wont work