React Router 404 page problem

I can try this code line;

<Switch>
        <Route exact path="/home" component={Home} />
        <Route component={ErrorPage} />
 </Switch>

But it’s don’t display an error component on the page.
I found one thing, Which one is at the top of the switch. it’s showing.
Example:

// Showing Home Component
<Switch>
        <Route exact path="/home" component={Home} />
        <Route component={ErrorPage} />
 </Switch>
// Showing ErrorPage component
<Switch>
        <Route component={ErrorPage} />
        <Route exact path="/home" component={Home} />
 </Switch>

Hi @OyeeBerkay !

I have only been working with react router for a few months so I am far from an expert.
But what happens when you try to add path="/error" to the error route?

Maybe you could add something like this

    <Router>
      <div className="App">
        <NavBar />
        <Switch>
          <Route path="/" exact component={Home} />
          <Route path="/about" exact component={About} />
          <Route path="/error" exact component={ErrorMsg} />
        </Switch>
      </div>
    </Router>

I made a code sandbox and played around with the code to see if I could get it working.

Maybe this will help.

But also maybe there is something in the react router docs that could help.

Good luck!

Thank you for the information but it’s doesn’t work.

What’s not working?
What error messages are you getting?

Also, it would probably help if you could provide a code sandbox so we can see the problem for ourselves.

I don’t get an error, it just can’t be displayed on the page. In addition, the project is not very suitable for setting up a virtual code environment and contains too much code. I can only share the error page and the codes of the part where I installed the switch environment.

Well maybe you can dig around some stack overflow answers or someone else might be able to diagnose the issue.

Good luck!

If it’s a catch-all 404/error page you can just match the path on * (i.e. everything) and have it at the bottom. You can look at the docs under the No Match (404) example.

However, when it comes to actual server redirects it depends on if you use the BrowserRouter or HashRouter what if any configuration is needed. Using the HashRouter is easier if you are dealing with a static file server. The actual configuration depends on the server/host (CRA deployment docs).

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.