Next.js Discord

Discord Forum

The redirect function doesnt work in client component

Answered
Cane Corso posted this in #help-forum
Open in Discord
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

Cane CorsoOP
ok router.push fixed the issue, which is dumb since redirect should work in client component
Answer
@Cane Corso ok router.push fixed the issue, which is dumb since redirect should work in client component
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