Can I "redirect" to a 404 page without changing the url?

[mattiaz9]

Basically if I have a dynamic route like: /posts/:id but the post with an id doesn't exist I want to show the 404 page, but also staying at the same url in the browser.

I tried using navigate component like that: <Navigate to="/404" replace={false} /> but it still redirects to /404.

Is it possible to achieve want I want?

[pawelphilipczyk]

Hi, I'm trying out many new things coming in data router and your question seemed interesting.

I'm not sure if you are asking about 6.4 or in general but I guess this approach will work in any case:

• Have an app-wide context with notFound boolean
• Render component as errorElement
• All this component does is use the context to set notFound to true
• The Root component renders not found content instead of the regular app and the URL stays the same

See this: https://stackblitz.com/edit/github-vvn3nt?file=src/main.jsx

[mattiaz9]

yep, that was exactly what I wanted. Rendering a 404 page without the nested layouts around the component and maintaining the same url!

Thank you!