Next.js Discord

Discord Forum

I want to redirect wrong path to my 404 page , but after 10 sec i want it to redirect to home page

Unanswered
Raspberry Horntail posted this in #help-forum
Open in Discord
Raspberry HorntailOP
'use client'
import React, { useEffect } from 'react'
import { useRouter } from 'next/navigation'

const NotFound = () => {
const router = useRouter()
useEffect(() => {
setTimeout(() => {
router.replace('/')
}, 10_000)
})
return <h1 className="text-white ">404 - Page Not Found</h1>
}
export default NotFound

this dont work for me , it only replace the url and page not load.

5 Replies

Plott Hound
hey this should do the trick:
'use client'
import React, { useEffect } from 'react'
import { useRouter } from 'next/navigation'

const NotFound = () => {
    const router = useRouter()
    useEffect(() => {
        setTimeout(() => {
            router.push('/')
        }, 10_000)
    })
    return <h1 className="text-white ">404 - Page Not Found</h1>
}
export default NotFound

you were close but needed to use router.push instead of replace
Raspberry HorntailOP
did't work with router.push , i also try it with window , redirect nothing works , only url changed but page did't load
Plott Hound
are you getting any errors or warnings in the browser or server console?
you could also try this
'use client'
import React, { useEffect } from 'react'
import { useRouter } from 'next/navigation'

const NotFound = () => {
    const router = useRouter()
    useEffect(() => {
        setTimeout(() => {
            router.push('/')
            router.refresh()
        }, 10_000)
    })
    return <h1 className="text-white ">404 - Page Not Found</h1>
}
export default NotFound
Raspberry HorntailOP
working with window.location.href